Template:DynamicListFormatter/styles.css:修订间差异
跳转到导航
跳转到搜索
无编辑摘要 |
无编辑摘要 |
||
第1行: | 第1行: | ||
/* | /* 容器样式:设置为两列布局 */ | ||
.dynamic-list-container { | .dynamic-list-container { | ||
display: flex; | display: flex; | ||
第7行: | 第7行: | ||
} | } | ||
/* | /* 修复 <p> 的默认样式,确保内容正常显示 */ | ||
.dynamic-list-container | .dynamic-list-container p { | ||
display: | margin: 0; /* 移除默认的外边距 */ | ||
display: contents; /* 让 <p> 的子元素直接作为容器的子元素显示 */ | |||
white-space: normal; /* 允许换行 */ | |||
} | } | ||
/* <a> 标签的样式 */ | /* 对 <a> 标签的样式 */ | ||
.dynamic-list-container | .dynamic-list-container a { | ||
flex: 0 0 calc(50% - 10px); /* 每行占 50% 的宽度,减去间距 */ | flex: 0 0 calc(50% - 10px); /* 每行占 50% 的宽度,减去间距 */ | ||
text-decoration: none; /* 去掉链接的下划线 */ | text-decoration: none; /* 去掉链接的下划线 */ | ||
color: #000; /* 链接默认文字颜色 */ | color: #000; /* 链接默认文字颜色 */ | ||
white-space: nowrap; /* | white-space: nowrap; /* 禁止链接内换行 */ | ||
overflow: hidden; /* 超出部分隐藏 */ | overflow: hidden; /* 超出部分隐藏 */ | ||
text-overflow: ellipsis; /* 超出部分用省略号表示 */ | text-overflow: ellipsis; /* 超出部分用省略号表示 */ | ||
第23行: | 第25行: | ||
/* 鼠标悬停时的样式 */ | /* 鼠标悬停时的样式 */ | ||
.dynamic-list-container | .dynamic-list-container a:hover { | ||
color: #007BFF; /* 鼠标悬停时的颜色 */ | color: #007BFF; /* 鼠标悬停时的颜色 */ | ||
text-decoration: underline; /* 鼠标悬停时显示下划线 */ | text-decoration: underline; /* 鼠标悬停时显示下划线 */ | ||
} | |||
/* 隐藏非 <a> 的纯文本(包括顿号 "、" 和零宽空格 `​`) */ | |||
.dynamic-list-container p::before, | |||
.dynamic-list-container p::after { | |||
content: ""; /* 移除 <p> 的开头和结尾内容 */ | |||
} | |||
.dynamic-list-container p > * { | |||
display: inline; /* 确保 <a> 标签内联显示 */ | |||
} | |||
.dynamic-list-container p { | |||
white-space: nowrap; /* 禁止 <p> 内换行 */ | |||
} | |||
.dynamic-list-container p a + a::before { | |||
content: ""; /* 清空链接之间的任何内容 */ | |||
} | } |