4

所以我一直在思考这个问题，我认为这不存在。我也明白我的逻辑与样式表试图适应的内容相反，但让我们试一试：

举个例子：

 // Example "template style"
 .blue_bold {
      color: blue;
      font-weight: bold;
      /* other styles can go here */
 }

所以假设我想将它添加到我的页脚中，我会在我的 HTML 中：

 <div class="blue_bold" id="footer">
      // Content goes here
 </div>

这是完美的，但是如果我想将该元素添加到我的许多元素中怎么办。假设我也想将它添加到我的导航中，然后我必须将该类添加到每个元素：

 <div class="blue_bold" id="navigation">
      // Content
 </div>
 ....
 <div class="blue_bold" id="footer">
      // Content
 </div>

我的问题是，与通过类或样式声明它一样，有没有办法将样式“附加”到样式表中的另一种样式？（例如：）

 #navigation, #footer  {
      attach_style(".blue_bold");
 }

这样我可以通过创建“基本样式”来最小化我的代码，然后将这些样式附加到我的样式表中的各个样式？这又只是一个问题，不是我想暗示的问题，但我认为，鉴于上述情况，对于使用品牌指南文件并希望将特定样式附加到个别样式而不去的人来说，这将是一个“很好的选择” html 来做到这一点。

有任何想法吗？这存在吗？

4

4 回答 4

3

你不能用纯 CSS 做到这一点。您需要使用LESS或SASS/SCSS来生成 CSS。

这里的语法示例：

较少的

.blue_bold {
    color: blue;
    font-weight: bold;
}
#navigation, 
#footer {
    .blue_bold;
}

SCSS

.blue_bold {
    color: blue;
    font-weight: bold;
}
#navigation, 
#footer {
    @extend .blue_bold;
}
于 2013-02-13T11:00:02.297 回答
0

你需要看看 sass 或更少，它们是你最好的选择。

在这里粗鲁

这里少

于 2013-02-13T11:00:04.607 回答
0

您可以使用 sass 或更少，但更基本的轻微解决方法是列出 css 中的元素，如下所示：

#navigation,
#footer,
.some-other-element,
.another-element
{
      // css styles go here that you want to apply to each element listed above
}
于 2013-02-13T11:02:02.717 回答
-4

看不到任何好处。您要求的不是标准的 CSS。您可以为所有具有类的元素定义它blue_bold

.blue_bold {
     color: blue;
     font-weight: bold;
     /* other styles can go here */
}

对于这个块

<div class="blue_bold" id="navigation"></div>

您可以像这样简单地添加另一个声明：

#navigation, #footer {
     background: black;
     color: red;
}

除非被覆盖，否则将使用 .blue_bold 中的所有内容。它有什么问题？

于 2013-02-13T11:02:16.083 回答