iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 13
1
自我挑戰組

蚵蚵攻城記系列 第 13

[Day13] Less nested

  • 分享至 

  • xImage
  •  

如果我們想定義某個class內的tag
在CSS可以這樣寫。

<div class='container1'>
  <h1>Head1</h1>
  <p>Paragraph1Paragraph1Paragraph1</p>
</div>
.container1 {
  background: #ff0000;
  width: 300px;
}

.container1 h1 {
  color: #0000ff;
}

.container1 p {
  font-weight: bold;
}

如果用LESS可以這樣寫:

.container1 {
  background: #ff0000;
  width: 300px;
  h1 {
    color: #0000ff;
  }
  p {
    font-weight: bold;
  }
}

可以少寫幾次.container
尤其是如果在這之中有很多的tag
可以省下不少時間。


上一篇
[Day12] Less mixin
下一篇
[Day14] 來認識UI
系列文
蚵蚵攻城記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言