css - 這種零碎的重復樣式該怎樣寫最優~
問題描述
問題解答
回答1:沒有必要對一個個的零散的重復屬性糾結,而應該把重心放到可重用的模塊上。不然你會越來越無法自拔,題目中開頭那段代碼我覺得就是最好的
回答2:可以利用js
回答3:可以花個10分鐘了解一下sass
回答4:看公共代碼的代碼量 和 功能
假如你有3個元素
.demo1{position: absolute;border: 1px solid #000; } .demo2{position: absolute;border: 2px solid #f55; } .demo3{position: absolute;border: 3px solid #f30; }
它們都有一個公共的postion:absolute;然后你提取出來單獨寫
.demo1,.demo2,.demo3{position: absolute; }
可以看出,這樣毫無意義,就一條代碼,提不提出來都無所謂。。最多增強一點微不足道的可讀性
但是如果是一大串功能性代碼,比如清除浮動,那么肯定要提取出來方便復用,比如SASS的做法:
%clearfix { *zoom: 1; &:before, &:after {display: table;content: ’’; } &:after {clear: both;overflow: hidden; }}
那么隨便你再哪里調用它,比如
.demo1{@extend %clearfix;.....其他代碼}.nav{@extend %clearfix;......其他代碼}sub-nav{@extend %clearfix;......其他代碼}最后都會自動合并為.demo1,.nav,.sub-nav{清除浮動公共代碼}
其實這和JS的function一樣,大量復用的自然做成插件,單獨一句console.log(XXX),雖然也到處寫,難道你還需要給它做成個插件么?直接寫就行了,不用糾結
相關文章:
1. angular.js - angularjs的自定義過濾器如何給文字加顏色?2. angular.js - angular內容過長展開收起效果3. 關于docker下的nginx壓力測試4. docker鏡像push報錯5. 關于nginx location配置的問題,root到底是什么6. linux - openSUSE 上,如何使用 QQ?7. 并發模型 - python將進程池放在裝飾器里為什么不生效也沒報錯8. 大家好,請問在python腳本中怎么用virtualenv激活指定的環境?9. python的前景到底有大?如果不考慮數據挖掘,機器學習這塊?10. linux - 升級到Python3.6后GDB無法正常運行?
