Nesting CSS classes(嵌套 CSS 类)

本文介绍了嵌套 CSS 类的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我可以执行以下操作吗?

Can I do something like the following?

.class1{some stuff}

.class2{class1;some more stuff}

推荐答案

原生 CSS 不可能.但是你可以使用类似的东西:

Not possible with vanilla CSS. However you can use something like:

  • Sass

Sass 让 CSS 再次变得有趣.萨斯是一个CSS3的扩展，添加嵌套规则、变量、混合、选择器继承，等等.已翻译使用格式良好的标准 CSS命令行工具或网络框架插件.

Sass makes CSS fun again. Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.

或者

  • 少

而不是构造长选择器用于指定继承的名称，在 Less 中你可以简单地将选择器嵌套在里面其他选择器.这使得继承清晰和样式表更短.

Rather than constructing long selector names to specify inheritance, in Less you can simply nest selectors inside other selectors. This makes inheritance clear and style sheets shorter.

示例:

#header {
  color: red;
  a {
    font-weight: bold;
    text-decoration: none;
  }
}

这篇关于嵌套 CSS 类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！