css制作流程及标准
（一）制作流程：
1，创建文件（文件管理及命名）
<ignore_js_op> ![]()
2，与html文档建立关系
<ignore_js_op> ![]()
注意点：
1）不建议使用：内联样式和内嵌样式
原因：结构（html）和表现（css样式）没有分离
2）区别：外链样式与导入样式（[url]http://zhidao.baidu.com/question/198616109.html）[/url]
3）网站常用：外链样式
3，制作页面样式
<ignore_js_op>![]() 注意点：
- 同html框架一致从上到下
- 从整体到局部
- 共用样式到个别样式
4，添加注释
<ignore_js_op>![]()
- color:#336699;
- 简写：color:#369;
3）字体
<ignore_js_op>![]()
- background-color:red;
- background-image:url();
- background-repeat:no-repeat;
- baclgrpimd-position:top right;
- background-attachment:fixed;
- (每个属性都可省略)简写：background:background-color background-image background-repeat background-position background-attachment;
5）内外边距（margin与padding简写方式相同）
<ignore_js_op>![]()
- border-width:1px;
- border-style:solid;
- border-color:red;
- 简写：border:border-width border-style border-color;
- border:1px solid red;
- 单边简写：border-top:1px solid red;
- border-right:1px solid red;
- border-bottom:1px solid red;
- border-left:1px solid red;
- （不推荐）单属性简写：(顺序：上右下左)
- border-width:border-top-width border-right-width border-bottom-width border-left-width;
- border-style:border-top-style border-right-style border-bottom-style border-left-style;
- border-color:border-top-color border-right-color border-bottom-color border-left-color;
-
css代码顺序
css文档的顺序
- 共用的代码样式放在文档最前面
-
css结构的顺序依照html的结构
css选择器中的属性顺序：显示属性->自身属性->文本属性
<ignore_js_op>![]()
- 显示属性：display, list-style, position, float, clear
-
自身属性：width, height, margin, padding,border,background
-
文本属性：color, font, text-decoration, text-align,vertical-align, white-space, content
原 因：这个顺序是项目开发的代码标准，符合浏览器的渲染顺序，最终达到提高执行效率目的
写了好久，希望对大家有帮助！！加油~~ |
|