<分区>
#menu1 a {
display: block;
background-color: #0066FF;
text-decoration: none;
font-family: calibri;
font-size: 20px;
color: #FFFFFF;
padding: 5px 5px;
}
#menu1 a:hover {
background-color: #0088FF;
}
#menu1 li {
display: inline-block;
}
#menu1 ul {
list-style: none;
text-align: center;
margin: 0 auto;
padding:0px;
}
这是我的代码。我试图将其全部放在一个 #menu1 下，因为我正在处理多个菜单，我不想失去我的概述。有人知道怎么做这个吗？也许有定位的东西？我的问题是:如何在一个#menu1 下获取 a、a:hover、li 和 ul 属性？
感谢您的帮助!
更新:
我有很多答案都提到了 LESS 或 SASS。我不熟悉那些语言。谁能向我解释这是什么以及如何使用它？指向清晰教程的链接就可以了。
最佳答案
大概你想做这样的事情:
#menu1 {
a { /* ... */ }
li { /* ... */ }
ul { /* ... */ }
}
这对于 CSS 是不可能的，并且没有解决方法来启用这种类型的结构；您必须完整地写出每个选择器，并依靠源代码中的逻辑分组和/或格式来提供结构。
但是，您可以使用 CSS 预处理器，例如 LESS或 SASS这将允许您编写上述代码并自动将其转换为原始的“哑”CSS 版本。
关于html - 如何将多个 CSS 属性添加到一个 CSS Id？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27783218/