如何寫CSS樣式變得更規(guī)范

這篇文章主要講解了“如何寫CSS樣式變得更規(guī)范”,文中的講解內(nèi)容簡單清晰,易于學(xué)習(xí)與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學(xué)習(xí)“如何寫CSS樣式變得更規(guī)范”吧!

成都創(chuàng)新互聯(lián)堅持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:網(wǎng)站制作、成都網(wǎng)站建設(shè)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿足客戶于互聯(lián)網(wǎng)時代的常州網(wǎng)站設(shè)計、移動媒體設(shè)計的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!

1. 按字母順序來排列css
不按字母順序排的:

代碼如下:

div#header h2 {
z-index: 101;
color: #000;:
position: relative;
line-height: 24px;
margin-right: 48px;
border-bottom: 1px solid #dedede;
font-size: 18px;
}


按字母順序排的:

代碼如下:

div#header h2 {
border-bottom: 1px solid #dedede;
color: #000;
font-size: 18px;
line-height: 24px;
margin-right: 48px;
position: relative;
z-index: 101;
}


理由是這樣的:可以更好的找到某個屬性。
2. 更好的組織css結(jié)構(gòu)
使用css注釋來給css分組,這樣結(jié)構(gòu)明了,也有利于協(xié)同設(shè)計。
/*****Reset*****/
xxxxxxx{www.sytm.net}
xxxxx{xxxxx}
/*****layouts*****/
xxxxxxx{www.sytm.net}
xxxxx{xxxxx}
3. 保持一致性
不要無意義的去討論到底一個選擇器的所有屬性寫在一行,還是每個屬性寫一行比較好。如果你就喜歡寫在一行,因?yàn)槊颗艑懸恍袝屨麄€文檔感覺太長了,找起來不方便。但是發(fā)給team的另一個人,他卻喜歡每句排一行,那怎么辦?其實(shí)很簡單,把css拿去w3c驗(yàn)證,它會有一份結(jié)果,會自動轉(zhuǎn)換成每排一行。
4. 先標(biāo)記 后css
對html的標(biāo)記弄好后再寫css會比較不容易出錯。比如寫一個頁面,先寫一個最基本的標(biāo)記結(jié)構(gòu)<body>

代碼如下:

<div id="wrapper">
<div id="header"><!--end #header-->
<div id="container">
<div id="content">
</div><!--end #content-->
<div id="sidebar">
</div><!--end #sidebarr-->
</div><!--end #container-->
<div id="footer">
</div>!<--end #footer-->
</div><!--end #wrapper-->
</body>


然后就是盡量善用子選擇器,而不是一要給哪個元素進(jìn)行樣式化,就給它添加個選擇器。
5. CSS Reset/重置
你可以copy Eric Meyer Reset, YUI Reset或其它c(diǎn)ss reset, 但你接下來應(yīng)該根據(jù)你的項(xiàng)目改成你自己的reset.
* { margin: 0; padding: 0; }這句并不適用一些元素比如單選按鈕,不過有單選按鈕就重新給單選按鈕重設(shè)就好了嘛。

感謝各位的閱讀,以上就是“如何寫CSS樣式變得更規(guī)范”的內(nèi)容了,經(jīng)過本文的學(xué)習(xí)后,相信大家對如何寫CSS樣式變得更規(guī)范這一問題有了更深刻的體會,具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是創(chuàng)新互聯(lián),小編將為大家推送更多相關(guān)知識點(diǎn)的文章,歡迎關(guān)注!

分享標(biāo)題:如何寫CSS樣式變得更規(guī)范
文章源于:http://bm7419.com/article26/jcesjg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供品牌網(wǎng)站設(shè)計、網(wǎng)站內(nèi)鏈、手機(jī)網(wǎng)站建設(shè)、動態(tài)網(wǎng)站、網(wǎng)頁設(shè)計公司、網(wǎng)站營銷

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

微信小程序開發(fā)