html - 在单个 div 中分组 css 标签

Question

我对同一个 div 中的不同标签有一堆不同的 CSS 编辑，想知道是否有办法将它们分组到一个 div 下？这就是我现在所拥有的：

#nav{
    margin: 8px auto 0px auto;
    border: 1px solid black;
    border-radius: 5px;
    box-shadow: 3px 3px rgba(0,0,0,0,0.4);
}

#nav li{
    display: inline;
    padding: 10px;  
}

#nav ul{
    list-style-type: none;
    padding: 0px;
    margin: 10px 5px auto 5px;
    height: 20px;
    line-height: 10px
}

#nav a{
    text-decoration: none;
}

我尝试将它们放在单个#nav 的大括号内，但它不起作用。

Answer 1

如果我正确地解释了您的问题，那么在纯 CSS 中该捷径是不可能的。您可能想查看 SASS 或 LESS，它们是 CSS 的元语言，这意味着有效的 CSS 是有效的 SASS/LESS 的子集。这两种支持结构

#nav{ 
    thing: example; 
    .child { more: styles; }
    .extra { style: great; } 
}

这将被解释为 CSS

#nav {
    thing: example; }

#nav .child { more: styles;}

#nav .extra { style: great;}