样式中的CSS样式？

Question

在样式中是否可能具有另一种样式？

例如，像这样的东西：

#content
{
text-align: center;
border-style:solid;
border-width:10px;
border-color: #121212;

     h1
     {
       font-family: arial;
     }

}

我实际想要做的是让标题字体在内容div中只使用arial字体。

- Henry-95

---

通过 http://sass-lang.com/，你可以实现这个功能。 - veritas

这将是CSS的一个不错的特性。 - Maciek Semik

来这里是因为我在外面看到了这种形式的CSS。感谢@veritas的澄清。 - stackprotector

Answer 1

不，只能这样：

#content
{
text-align: center;
border-style:solid;
border-width:10px;
border-color: #121212;
}


#content h1
{
       font-family: arial;
}

- Māris Kiseļovs

Answer 2

这就是您需要的。

#content
{
    text-align: center;
    border-style:solid;
    border-width:10px;
    border-color: #121212;
}

#content #header
{
    font-family: arial;
}

更新：由于您的问题已更改

该句话意为“由于您的问题已经变化，以下是新的回答”。

#content h1
{
    font-family: arial;
}

- Mouhannad

Answer 3

如果你愿意，你可以使用LESS，但这里发表的其他解决方案也可以正常工作。如果包含了LESS，你需要有一个javascript include来解析LESS到实际的CSS（从网站上）：

<link rel="stylesheet/less" type="text/css" href="styles.less">
<script src="less.js" type="text/javascript"></script>

您可以使用node.js在服务器端解析CSS并提供已编译的CSS文档。

- Pelshoff

Answer 4

这应该可以做到。

#content
{
text-align: center;
border-style:solid;
border-width:10px;
border-color: #121212;
}

#content > #header
{
font-family: arial;
}

它只会将标题内的字体设置为 Arial。

这是 CSS 中嵌套的正确方式。

- Deep Frozen

Answer 5

尝试这个，因为很多样式表很容易变得混乱。

#content{text-align: center; border-style:solid; border-width:10px; border-color: #121212;}
h1 { font-family: arial;}

基本上，无论您何时在同一行关闭 {}，还是缩进，都没有关系。所显示的内容可以节省空间。

- Bertran