鍍金池/ 問答/C  HTML/ css中 .class.class 與.class .class,哪個的性能和維

css中 .class.class 與.class .class,哪個的性能和維護(hù)性較好,在實(shí)際的開發(fā)中需要注意這個嗎

例如

<li class="list-item">
   <h1 class="title list"></h1>
</li>

.list-item .title{}還是用.title.list{}

回答
編輯回答
影魅

1.如果你的title類和list類可能出現(xiàn)復(fù)用也就是其他元素也可能用到這兩個類的情況下那肯定是分開寫的
2.如果只是要定義list的樣式,那么一個類就夠了

2017年10月5日 09:34
編輯回答
朽鹿

首先。。。
你這個命名就很有問題。。。
一般title應(yīng)該只有一個吧,而一個list代表的是一個列表,這兩個平級。。。你的html到底要寫什么結(jié)構(gòu)出來。。。
其實(shí)css最難的只有命名,其命名決定了他的復(fù)用跟封閉。至于選擇器的選擇都不是問題。
比如你是要把list item進(jìn)行封裝
此時你很明確,一個list里面必須有item,Item必須在list里面
那么就是
.list .item甚至是.list>.item
這樣可以最大程度得保證你的樣式不會錯亂。
至于性能我覺得你可以先不要去關(guān)心。先考慮復(fù)用性,寫多了自然知道怎么選擇了,自然知道什么地方好什么地方不好。
至于怎么保持高復(fù)用性,其實(shí)我自己的建議是使用scss這種預(yù)處理器去寫,然后堅(jiān)持一個原則,以前的時候的頁面源代碼結(jié)構(gòu)通常是
page

.js
.html
.css/.scss

現(xiàn)在變成
page

.js
.html

style

.css

這種結(jié)構(gòu)來寫。我覺得就可以強(qiáng)制性的去提高復(fù)用性了。當(dāng)你在寫js的時候,或許你是在寫業(yè)務(wù),而當(dāng)你在寫css的時候,要去意識到自己寫的是一個框架(當(dāng)然想vue這種就應(yīng)該考慮怎么不寫css不引入樣式框架而一切復(fù)用都用組件解決了)
我也是還在學(xué)習(xí)中,希望給你點(diǎn)幫助

2017年12月23日 07:23