文章详情

返回首页

html常用代码

分享文章 作者: Ws01 创建时间: 2025-11-25 更新时间: 2025-12-28 📝 字数: 1,100 字 👁️ 阅读: 93 次
html常用代码
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);

留言

暂无留言

0 / 100