• 我转过几个弯 绕过那个小雨楼
  • 拿着蒲扇摆着衣衫渡着紧箍咒
  • 不问天涯不停留 喝过几壶酒
  • 不过年少白头道义放胸口
  • 倘若明天之后 遥看前尘剑封侯
  • 似那天上神仙无所求
  • 朝朝暮暮君如梦醒十分不为何理由
  • 是真是假是惶恐是无休
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 又过了几个弯 算尽天量道莫慌
  • 踏这田园闻这芳草香
  • 跌跌撞撞仗剑天涯折煞不枉无笔良
  • 是梦是幻是温柔是家乡
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 路过这风雨花满楼 片刻都不停留
  • 我本这书生进京赶考留下许多愁
  • 你问有没有时候 我叹这天道默悠悠
  • 能否与我一醉方休
  • 谁能与我一醉方休

嵌套

139 0

sass最大的也是最常用的功能就是嵌套了。

#nav {
  ul {
    color:red;
  }
}

这种写法可以理解为:

#nav ul {
  color:red;
}

当我们要对#nav下多个元素控制css样式的时候,嵌套就显得非常方便,因为父选择器我们只需要写一次。

虽然说可以无限嵌套下去,但是如果你根据dom树的结构进行嵌套,你会发现维护起来非常麻烦,因为内容一多,你可能都不知道这个class的父级是谁,所以一般来说,sass的嵌套最好保持在四层以内。

嵌套属性

我们写css经常会有很多重复的前缀名,比如说font系列的前缀,background的前缀,前面都是相同的,只有后面部分不同,所以我们可以进行属性的嵌套

font: {
  size:19px;
  weight:bold;
}
background: {
  color:red;
  image:url("xxx.jpg");
}

这种属性嵌套可以转换为:

font-size:19px;
font-weigth:bold;

background-color:red;
background-image:url("xxx.jpg");

这样就可以省去了书写重复的前缀的代码,及其便捷。

0
  • 本文分类:SASS
  • 本文标签:sass嵌套
  • 流行热度:已超过 139 人围观了本文
  • 最后更新:2020年04月20日 - 18时03分49秒
  • 发布日期:2020年04月20日 - 18时03分49秒
  • 版权申明:本文系作者@木灵鱼儿原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。
微信收款码
微信收款码