转自:
一、在样式表开头添加一个注释块,用以描述这个样式表的创建日期、创建者、标记等备注信息。
Example Source Code:/* ---------------------------------Site: Site name Author: 52CSS.comUpdated: Date and time Updated by: Name --------------------------------- */ |
二、包括公用颜色标记
Example Source Code:/* --------------------------------- COLORSBody background: #def455Container background: #fff Main Text: #333 Links: #00600f Visited links: #098761 Hover links: #aaf433 H1, H2, H3: #960 H4, H5, H6: #000 ---------------------------------*/ |
三、给ID和Class进行有意义的命名
不推荐的命名方式:
Example Source Code:.green-box { ... } #big-text { ... } |
推荐使用的命名方式:
Example Source Code:.pullquote {... }#introduction {... } |
四、将关联的样式规则进行整合
Example Source Code:#header { ... } #header h1 { ... } #header h1 img { ... }#header form { ... }#header a#skip { ... }#navigation { ... }#navigation ul { ... }#navigation ul li { ... }#navigation ul li a { ... }#navigation ul li a:hover { ... }#content { ... }#content h2 { ... }#content p { ... }#content ul { ... }#content ul li { ... } |
五、给样式添加清晰的注释
Example Source Code:/*--------------------------------- header styles --------------------------------- */ #header { ... }#header h1 { ... }#header h1 img { ... }#header form { ... }/* --------------------------------- navigation styles--------------------------------- */#navigation { ... } |