属性嵌套

作者: Lia代码猪崽 | 来源:发表于2018-01-18 17:36 被阅读9次

在教程中很多人都说反人类,可是我觉得很方便啊??谜。。

Sass 中还提供属性嵌套,CSS 有一些属性前缀相同,只是后缀不一样,比如:border-top/border-right,与这个类似的还有 margin、padding、font 等属性。

假设你的样式中用到了:

.box1 {
    border-top: 1px solid red;
    border-bottom: 1px solid green;
}

.box2 {
  font-size: 12px;
  font-weight: bold;
}

在 Sass 中我们可以这样写:

.box1 {
  border: {
   top: 1px solid red;
   bottom: 1px solid green;
  }
}

.box2 {
  font: {
   size: 12px;
   weight: bold;
  }  
}

属性嵌套适用于属性名中间有“ - ”的属性

相关文章

  • 3.Sass 嵌套规则与属性

    嵌套规则 Sass 嵌套 CSS 选择器类似于 HTML 的嵌套规则。 嵌套属性 很多 CSS 属性都有同样的前缀...

  • 属性嵌套

    在教程中很多人都说反人类,可是我觉得很方便啊??谜。。 Sass 中还提供属性嵌套,CSS 有一些属性前缀相同,只...

  • Sass/Scss--2

    八.嵌套-选择器嵌套 Sass 的嵌套分为三种: 选择器嵌套 属性嵌套 伪类嵌套 html 结构: 选中 h...

  • 【CSS】SCSS

    Scss语法 变量 $ 嵌套 父选择器 属性嵌套 占位符 % 运算 / % < <= > >= ...

  • (一)SCSS基础用法

    1.当变量使用 2.计算功能、嵌套 3.属性嵌套

  • 结构体嵌套

    普通结构体嵌套 普通结构体嵌套,嵌套结构体可以通过 .子变量.方法 的方式获取被嵌套的属性和方法 匿名嵌套 匿名嵌...

  • 『Android』解决 RecyclerView 嵌套在 Nes

    在被嵌套的 RecyclerView 中加入属性:

  • 嵌套

    index.scss index.css 嵌套时使用&符号调用父选择器 嵌套属性

  • Sass嵌套

    选择器嵌套 css属性嵌套xx: CSS 有一些属性前缀相同,只是后缀不一样,比如:border-top/bord...

  • sass语法

    所有变量用$开头,如果变量要嵌套在字符串里,用#{$var}格式 计算功能 嵌套,自身属性嵌套需要“:”,可以用&...

网友评论

    本文标题:属性嵌套

    本文链接:https://www.haomeiwen.com/subject/epiwoxtx.html