Sass中的层级结构__sass架构

相关文章推荐

悲伤的熊猫 · 冬游西藏上线提醒！秋冬季节的波密才是“王炸” ...· 3 月前 ·

温柔的铁板烧 · 叶轻眉五竹闽南语怎么讲- 抖音· 9 月前 ·

失眠的芹菜 · 描写角度有哪些· 1 年前 ·

安静的春卷 · 全世界最会得奖的电影导演和一个失去的国度· 1 年前 ·

茫然的筷子 · 福原爱江宏杰婚变原因警醒所有女性，婚姻中三个 ...· 1 年前 ·

SASS 中的层级结构，和 LESS 一样支持嵌套，默认情况下嵌套的结构会转换成后代选择器，和 LESS 一样也支持通过 & 符号不转换成后代选择器

.father {
  width: 300px;
  height: 300px;
  background: red;

  .son {
    width: 200px;
    height: 200px;
    background: blue;
  }
}

Sass中的层级结构_选择器

通过 & 符号不转换成后代选择器

.father {
  width: 300px;
  height: 300px;
  background: red;

  &.son {
    width: 200px;
    height: 200px;
    background: blue;
  }
}

Sass中的层级结构_Sass_02

.father {
  width: 300px;
  height: 300px;
  background: red;

  &:hover {
    width: 200px;
    height: 200px;
    background: pink;
  }

  .son {
    width: 200px;
    height: 200px;
    background: blue;
  }
}

Sass中的层级结构_选择器_03

推荐文章

悲伤的熊猫 · 冬游西藏上线提醒！秋冬季节的波密才是“王炸”！_手机搜狐网

3 月前

温柔的铁板烧 · 叶轻眉五竹闽南语怎么讲- 抖音

9 月前

失眠的芹菜 · 描写角度有哪些

1 年前

安静的春卷 · 全世界最会得奖的电影导演和一个失去的国度

1 年前

茫然的筷子 · 福原爱江宏杰婚变原因警醒所有女性，婚姻中三个行为不要将就

1 年前