我正在尝试重新设计我的网站菜单配置。
我正在使用列表来显示菜单选项，并且该列表的样式类型为圆形。
这是一张图片:
代码如下:
<li class='category'><a href='$docPath/category/$catDirPath/'>$catName</a></li>
li.listCategory {
list-style-type: circle;
margin-left: 17px;
}
我想做的是，一旦用户选择了导航菜单的这一部分，整行就会以黄色突出显示。
所有与此相关的代码都有效，但我遇到的问题与此行的样式有关，或 <li>标签。
我的第一次尝试产生了不良影响:
<li class='category' id='selectedCat'><a href='$docPath/category/$catDirPath/'>$catName</a></li>
li#selectedCat {
background-color: #FFCC00;
list-style-type: disc;
}
所以我删除了类别类中设置的边距，结果是这样的:
请注意，现在显示该选项已被选中的漂亮列表样式已经消失了...
所以我基本上想做的是设计这个区域的样式:
有人对我如何完成这项任务有任何建议或想法吗？
提前感谢您花时间阅读本文!
最佳答案
您需要一个额外的 list-style-position: inside; 来将元素符号移动到列表项中。
关于HTML/CSS - 列表 - 使用列表样式时将背景颜色应用于整行？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10721376/