编写维护性极佳的CSS代码实例:
一、在样式表开头添加一个注释块,用以描述这个样式表的创建日期、创建者、标记等备注信息。
Example Source Code:
/*
---------------------------------
Site: Site name
Author: 52CSS.com
Updated: Date and time
Updated by: Name
---------------------------------
*/
二、包括公用颜色标记
Example Source Code:
/*
---------------------------------
COLORS
Body background: #def455
Container 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 { ... }
相关视频
相关阅读 CSS代码生成工具下载CSS代码大全浏览器不能解析CSS代码如何解决lol6月27维护到几点 lol6月27日更新内容一览绝地求生1月16日维护公告 绝地求生1月16日维护内容一览英雄联盟今天维护到什么时候结束 最新维护公告2018lol10月11日更新了什么 lol10月11日更新维护内容一览绝地求生更新维护公告一览 吃鸡维护常见问题解决方法
热门文章 没有查询到任何记录。
最新文章
页面进入效果表单
XHTML校验需要注意的6个细节CSS样式表创建美妙绝伦的网站了解XHTML DHTML SHTML之间的区别HTML小技巧的一些小技巧
人气排行 容易被误解的overflow:hiddenCSS中dashed和dotted的区别CSS水平和垂直居中的几种实现方法DIV+CSS自适应高度兼容IE6,ie7,ie8和FF的解css优先级问题如何用CSS实现图片圆角化处理超链接target=_blank的使用方法Ctrl+H键的用法
查看所有0条评论>>