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. macos - 如何徹底刪除mac自帶的apache和php2. javascript - sublime快鍵鍵問題3. docker 17.03 怎么配置 registry mirror ?4. DADB.class.php文件的代碼怎么寫5. javascript - immutable配合react提升性能?6. css - 寫頁面遇到個布局問題,求大佬們幫解答,在線等,急!~7. mysql事務回滾定位8. javascript - html5多個label中其中一個觸發change,如何判斷是哪一個出發了change9. 實現bing搜索工具urlAPI提交10. css - 移動端字體設置問題

網公網安備