当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > CSS 约定写法 利用扩展

CSS样式表
css 块状元素和内联元素
CSS 盒模型、块状元素与内联元素、CSS选择器
css 浮动 理解Float的含义
CSS 清除浮动Clear
CSS 制作网页导航条(上)
CSS 制作网页导航条(下)
css 浮动(float)页面布局
css 浮动(float)页面布局(下)
css position 定位
css 定位应用实例
CSS Hack 有关浏览器兼容方面
css 单图片按钮实例(css 图片变换)
使用X-UA-Compatible来设置IE浏览器兼容模式
div overflow 超出隐藏属性使用说明
CSS 使用规则总结
div+CSS 兼容小摘
CSS的inherit与auto使用分析
如何组织和注释CSS文件
CSS样式按整洁易懂的结构组织
CSS Prism 查看和编辑CSS中用到的颜色

CSS样式表 中的 CSS 约定写法 利用扩展


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 42 ::
收藏到网摘: n/a

以前在程序中,有美工设计好了静态页面,而我们程序员将其整理成动态页面(例如jsp页面),一般程序员是不会管像图片、样式这样的东西,直接拿来就用了。这时可能出现下面几个问题:
1 修改过几次后,会出现无用的样式或者图片;
2 不同页面所用的样式可能在一个css文件中,查找起来非常的麻烦。
3 没有良好的结构,对以后的扩展(例如换肤)非常不利
4 样式或者图片名称起的很随意或者不符合实际要求,对理解有一定的影响。
下面是总结的一些css使用约定:
1尽量使用外部链接的方式引入css

2 css文件开发版本中尽量加入样式注释

3 css命名规则:
css文件名称建议具有实际意义,例如,公用css可以命名为cmm.css、邮件专用css可以命名为:mail.css
4 css样式命名规则:
样式命名建议根据实际用途进行命名,例如,用于标题的样式可以.title{};
尽可能的保证不同css中定义的样式不会发生命名上的冲突,以免造成不必要的相互影响
5 css用到的图片放置规则:
Css用到的图片,主要是背景。可以按照如下规则去做:
在css文件相同目录下建立文件夹images.在images下新建与css同名的文件夹(不带.css后缀名称),css文件的图片均放在这里面,demo3.html
详见示例:demo3.html
6建议将布局css与皮肤css分开编写。
布局Css即那些对网站骨骼结构产生影响的css,比如宽高、border、margin等等。
皮肤CSS指的是诸如颜色、背景图片这样的,不会对页面骨骼结构产生影响的css。这里分开,主要是为了以后的换肤功能,如不实现换肤的话,可以写在一起。
7布局css如果只用到一次(在一个页面中的一处地方使用),可以写在页面中,甚至直接写在html元素中,如果用到2次以上(同一页面或者不同页面中),必须归纳出来形成独立的css。