Template:DynamicListFormatter/styles.css:修订间差异
跳转到导航
跳转到搜索
小 Selfice已移動頁面Template:首页/最新条目/styles.css至Template:DynamicListFormatter/styles.css,不留重新導向 |
无编辑摘要 |
||
第1行: | 第1行: | ||
. | .dynamic-list-wrapper { | ||
display: flex; | |||
flex-wrap: wrap; /* 自动换行 */ | |||
gap: 10px; /* 列和行的间距 */ | |||
width: 100%; /* 父容器占满宽度 */ | |||
} | } | ||
. | .dynamic-list-wrapper[data-columns="2"] .dynamic-list-item { | ||
width: calc(50% - 10px); /* 两列布局 */ | |||
} | } | ||
. | .dynamic-list-wrapper[data-columns="3"] .dynamic-list-item { | ||
width: calc(33.333% - 10px); /* 三列布局 */ | |||
} | |||
.dynamic-list-wrapper[data-columns="4"] .dynamic-list-item { | |||
width: calc(25% - 10px); /* 四列布局 */ | |||
} | |||
.dynamic-list-item { | |||
white-space: nowrap; /* 禁止换行 */ | |||
overflow: hidden; /* 超出部分隐藏 */ | |||
text-overflow: ellipsis; /* 超出部分用省略号表示 */ | |||
text-decoration: none; /* 去掉下划线 */ | |||
color: #000; /* 默认文字颜色 */ | |||
display: inline-block; /* 确保布局正常 */ | |||
} | |||
.dynamic-list-item:hover { | |||
color: #007BFF; /* 鼠标悬停时文字颜色 */ | |||
text-decoration: underline; /* 鼠标悬停时显示下划线 */ | |||
} | |||
.error { | |||
color: red; | |||
font-weight: bold; | |||
} | } |
2025年1月23日 (四) 16:05的版本
.dynamic-list-wrapper { display: flex; flex-wrap: wrap; /* 自动换行 */ gap: 10px; /* 列和行的间距 */ width: 100%; /* 父容器占满宽度 */ } .dynamic-list-wrapper[data-columns="2"] .dynamic-list-item { width: calc(50% - 10px); /* 两列布局 */ } .dynamic-list-wrapper[data-columns="3"] .dynamic-list-item { width: calc(33.333% - 10px); /* 三列布局 */ } .dynamic-list-wrapper[data-columns="4"] .dynamic-list-item { width: calc(25% - 10px); /* 四列布局 */ } .dynamic-list-item { white-space: nowrap; /* 禁止换行 */ overflow: hidden; /* 超出部分隐藏 */ text-overflow: ellipsis; /* 超出部分用省略号表示 */ text-decoration: none; /* 去掉下划线 */ color: #000; /* 默认文字颜色 */ display: inline-block; /* 确保布局正常 */ } .dynamic-list-item:hover { color: #007BFF; /* 鼠标悬停时文字颜色 */ text-decoration: underline; /* 鼠标悬停时显示下划线 */ } .error { color: red; font-weight: bold; }