css制作流程及标准
（资源来自网上，具体地址已忘，版权问题概不负责）
（一）制作流程：
1，创建文件（文件管理及命名）
2，与html文档建立关系
注意点：
1）不建议使用：内联样式和内嵌样式
原因：结构（html）和表现（css样式）没有分离
2）区别：外链样式与导入样式（[url]http://zhidao.baidu.com/question/198616109.html）[/url]
3）网站常用：外链样式
3，制作页面样式
注意点：
同html框架一致从上到下
从整体到局部
共用样式到个别样式
4，添加注释
注释范围：
1）每个文档对应一个文档注释（方便后期维护和管理）
主要注释说明：文档创建人，时间，内容等
2）属性注释说明：css hack，特殊属性等
3）功能注释说明：默认样式，按钮，弹出框等
5，完成检查
*********************************************************************
（二）制作标准：（有利于开发和后期管理）
这个标准是我们公司的。各个公司有所不同，仅供大家参考~~
缩进及换行：
说明：
缩进：设置tab键制表符（同html的一样）——点击tab生成2个空格
换行：
选择器换行：相同样式2个以上选择器，每个选择器一行
属性换行：
1）只有一个属性时，选择器与属性在同行
2）2个以上属性，每个属性占一行
简写
1）颜色：16进制颜色值:#RRGGBB——R,G,B都成对相同时，缩写成：#RGB
复制代码运行代码编辑代码
color:#336699;
简写：color:#369;
复制代码运行代码编辑代码
Powered by W3Cfuns.com
2）单位：数值为0时，单位可以省略
复制代码运行代码编辑代码
margin:0px;
简写：margin:0;
复制代码运行代码编辑代码
Powered by W3Cfuns.com
3）字体
？？？？？？上面不是很明白？？？？？？
4）背景
复制代码运行代码编辑代码
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;
background:red url() no-repeat top right fixed;//这一段代码是我自己从下面总结的，不确定他的准确性。
有待考证……
复制代码运行代码编辑代码
Powered by W3Cfuns.com
5）内外边距（margin与padding简写方式相同）
6）边框
复制代码运行代码编辑代码
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;
复制代码运行代码编辑代码
Powered by W3Cfuns.com
css代码顺序
css文档的顺序
共用的代码样式放在文档最前面
css结构的顺序依照html的结构
css选择器中的属性顺序：显示属性->自身属性->文本属性
显示属性：display,
list-style, position, float, clear
自身属性：width,
height, margin,
padding,border,background
文本属性：color,
font, text-decoration, text-align,vertical-align,
white-space, content
原
因：这个顺序是项目开发的代码标准，符合浏览器的渲染顺序，最终达到提高执行效率目的
（资源来自网上，具体地址已忘，版权问题概不负责）
（一）制作流程：
1，创建文件（文件管理及命名）
2，与html文档建立关系
注意点：
1）不建议使用：内联样式和内嵌样式
原因：结构（html）和表现（css样式）没有分离
2）区别：外链样式与导入样式（[url]http://zhidao.baidu.com/question/198616109.html）[/url]
3）网站常用：外链样式
3，制作页面样式
注意点：
同html框架一致从上到下
从整体到局部
共用样式到个别样式
4，添加注释
注释范围：
1）每个文档对应一个文档注释（方便后期维护和管理）
主要注释说明：文档创建人，时间，内容等
2）属性注释说明：css hack，特殊属性等
3）功能注释说明：默认样式，按钮，弹出框等
5，完成检查
*********************************************************************
（二）制作标准：（有利于开发和后期管理）
这个标准是我们公司的。各个公司有所不同，仅供大家参考~~
缩进及换行：
说明：
缩进：设置tab键制表符（同html的一样）——点击tab生成2个空格
换行：
选择器换行：相同样式2个以上选择器，每个选择器一行
属性换行：
1）只有一个属性时，选择器与属性在同行
2）2个以上属性，每个属性占一行
简写
1）颜色：16进制颜色值:#RRGGBB——R,G,B都成对相同时，缩写成：#RGB
复制代码运行代码编辑代码
color:#336699;
简写：color:#369;
复制代码运行代码编辑代码
Powered by W3Cfuns.com
2）单位：数值为0时，单位可以省略
复制代码运行代码编辑代码
margin:0px;
简写：margin:0;
复制代码运行代码编辑代码
Powered by W3Cfuns.com
3）字体
？？？？？？上面不是很明白？？？？？？
4）背景
复制代码运行代码编辑代码
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;
background:red url() no-repeat top right fixed;//这一段代码是我自己从下面总结的，不确定他的准确性。
有待考证……
复制代码运行代码编辑代码
Powered by W3Cfuns.com
5）内外边距（margin与padding简写方式相同）
6）边框
复制代码运行代码编辑代码
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;
复制代码运行代码编辑代码
Powered by W3Cfuns.com
css代码顺序
css文档的顺序
共用的代码样式放在文档最前面
css结构的顺序依照html的结构
css选择器中的属性顺序：显示属性->自身属性->文本属性
显示属性：display,
list-style, position, float, clear
自身属性：width,
height, margin,
padding,border,background
文本属性：color,
font, text-decoration, text-align,vertical-align,
white-space, content
原
因：这个顺序是项目开发的代码标准，符合浏览器的渲染顺序，最终达到提高执行效率目的
