如何将多个CSS属性添加到一个CSS ID？

Question

#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的答案。我不熟悉那些语言。任何人都可以向我解释这是什么以及如何使用它？指向清晰教程的链接很好。

Answer 1

大概你想做这样的事情：

#menu1 {
    a { /* ... */ }
    li { /* ... */ }
    ul { /* ... */ }
}

CSS无法实现这一点，并且没有解决方法来启用此类结构;你必须完整地写出每个选择器，并依赖源中的逻辑分组和/或格式来提供结构。

但是，您可以使用CSS预处理程序，例如LESS或SASS，这样您就可以编写如上所述的代码并将其转换为您原来的＆＃34; dumb＆＃34; CSS版本自动。