Template:DynamicListFormatter/styles.css：修订间差异
跳转到导航
跳转到搜索
创建页面，内容为“.custom-wrapper { display: flex; flex-wrap: wrap; →允许内容换行分布： width: 100%; →父元素宽度： } .custom-wrapper > * { width: 50%; →两列，各占父元素的50%宽度： box-sizing: border-box; →包括内边距和边框在内计算宽度： white-space: nowrap; →禁止换行： overflow: hidden; →超出部分隐藏： text-overflow: ellipsis; →超出部分用省略号代替： padding: 5px; /* 给每个元素一些内…” |
无编辑摘要 |
||
| 第1行： | 第1行： | ||
.custom-wrapper { | .custom-wrapper { | ||
display: flex; | display: flex; | ||
flex-wrap: wrap; /* | flex-wrap: wrap; /* 允许内容换行 */ | ||
width: 100%; /* | width: 100%; /* 父容器占满宽度 */ | ||
gap: 10px; /* 添加一些列和行之间的间距 */ | |||
list-style: none; /* 去掉默认样式（如果是列表） */ | |||
padding: 0; | |||
margin: 0; | |||
} | } | ||
.custom-wrapper | .custom-wrapper a { | ||
width: 50%; /* | width: calc(50% - 10px); /* 每列占50%，减去间隙 */ | ||
box-sizing: border-box; /* | box-sizing: border-box; /* 确保内容宽度计算正确 */ | ||
white-space: nowrap; /* 禁止换行 */ | white-space: nowrap; /* 禁止换行 */ | ||
overflow: hidden; /* 超出部分隐藏 */ | overflow: hidden; /* 超出部分隐藏 */ | ||
text-overflow: ellipsis; /* | text-overflow: ellipsis; /* 超出部分用省略号表示 */ | ||
display: inline-block; /* 保证块级布局 */ | |||
text-decoration: none; /* 去掉下划线 */ | |||
color: #000; /* 设置文字颜色（可根据需求修改） */ | |||
} | |||
.custom-wrapper a:hover { | |||
color: #007BFF; /* 鼠标悬停时改变链接颜色 */ | |||
text-decoration: underline; /* 鼠标悬停时添加下划线 */ | |||
} | } | ||