我正在使用基金会。我有一个如下结构的下拉菜单：
<div class="dropdown"><ul><li>...
我想更改此菜单中所有元素的字体大小。但是，当我尝试使用.dropdown { font-size: 0.5em; }定位它们时，我会被基础样式中的此规则覆盖：ul, ol, dl { font-size: 1rem; }。
我唯一可以专门针对列表元素吗？即.dropdown ul { font-size: 0.5em; }。这引入了许多不必要的特异性。更糟糕的是，嵌套列表还有第二个字体大小规则，所以我必须考虑到更具体的选择器。好像我会经常旅行。
我错过了什么吗？我怎么能让这不是一个烦恼？
答案 0 :(得分：1)
您需要使样式更具体或更改所有列表的默认大小。
原因是ul, ol, dl { font-size: 1rem }。如果它一直在使用em或％，那么它会愉快地从祖先元素（在这种情况下为.dropdown，即.5em）中获取其上下文。
所以，你可以这样做：
ul, ol, dl {
font-size: 1em; // or 100%
}
或者
.dropdown ul, .dropdown ol, .dropdown dl {
font-size: 1em; // or 100%
}
他们都会做你正在寻找的东西，而不会产生与你所建议的样式相关的副作用（.dropdown ul { font-size: .5em }）。我提供的第二个选项应该足够具体，以覆盖嵌套列表的样式。