transform: translateY(12px); / 子元素往下移动12px /
transform: translateY(-12px); / 子元素往上移动12px /
justify-content: space-between; / 子元素分散排列 /
justify-content: flex-start; / 子元素从左侧开始排列 /
gap: 20px; / 子元素之间的空隙 /
background: url('https://121.freewebhostmost.com/') no-repeat center center fixed; / 背景图片 /
background-color: #f4f4f4; / 背景色 /
min-height: 60px; / 最小高度设置为60px /
max-height: 120px; / 最大高度设置为120px /
font-size: 18px; / 字号大小/
border-radius: 5px; / 四角弧度,一般高为5,50为圆/
border: 2px solid gray; / 添加2px灰色边框 /
border: 1px #aaa; / 添加 1px 和 #aaa 色边框 /
--border-color: #aaa; / 边框,原#436EEED /
overflow-y: auto; / 当内容超过最大高度时显示滚动条 /
margin-left: 20px; / 分类标签右移添加这一行 /
color: green; / 分类标签字体颜色添加这一行 /
text-align: left; / 添加左对齐 /
/ 设置文件名的最大宽度,并且超出部分省略显示 /
.file-name {
max-width: 200px; / 设置最大宽度,您可以调整为合适的值 /
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-block; / 确保文件名在一行内显示 /
}
/ 设置图片背景的毛玻璃效果,值越大越模糊 /
backdrop-filter: blur(2px);