css层级样式,Css层级

css是样式吗？

css（层叠样式表）层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化

创新互联-专业网站定制、快速模板网站建设、高性价比魏县网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式魏县网站制作公司更省心,省钱,快速模板网站建设找我们，业务覆盖魏县地区。费用合理售后完善，十年实体公司更值得信赖。

1、新建一个html文件，命名为test.html

2、在test.html文件内，使用css设置页面所有的div宽度为300px，高度为300px，div的位置为绝对定位。

3、在test.html文件内，创建三个div，并用文字标识，分别为底层div、中层div、最顶层div。

4、在test.html文件内，分别给三个div设置class属性为one、two、three，用于下面对类名进行样式设置。

5、在css标签内，设置类名为one的div样式，设置其背景颜色为红色，距离页面左边缘为0，距离页面上边缘为0，同时使用z-index设置其层级为1。

6、在css标签内，设置类名为two的div样式，设置其背景颜色为黄色，距离页面左边缘为50px，距离页面上边缘为50px，同时使用z-index设置其层级为2，即在类名为one的div的上面。

7、在css标签内，设置类名为three的div样式，设置其背景颜色为粉红色，距离页面左边缘为100px，距离页面上边缘为100px，同时使用z-index设置其层级为3，即在页面三个div中的最顶层。

8、在浏览器打开test.html文件，查看实现的层级效果。

会啊，层级对于css样式来说是很重要的。层级直接决定了，样式是否生效。

按照良好的CSS书写规范来写CSS代码，这样会提高代码的阅读体验。下面具体说几点。

CSS书写顺序

位置属性(position, top, right, z-index, display, float等)

大小(width, height, padding, margin)

文字系列(font, line-height, letter-spacing, color- text-align等)

背景(background, border等)

其他(animation, transition等)

使用CSS缩写属性

CSS有些属性是可以缩写的，比如padding,margin,font等等，这样精简代码同时又能提高用户的阅读体验。

去掉小数点前的“0”

连字符CSS选择器命名规范

1.长名称或词组可以使用中横线来为选择器命名。

2.不建议使用“_”下划线来命名CSS选择器，为什么呢？

输入的时候少按一个shift键；

浏览器兼容问题（比如使用_tips的选择器命名，在IE6是无效的）

能良好区分JavaScript变量命名（JS变量命名是用“_”）

本文名称：css层级样式,Css层级
地址分享：http://ybzwz.com/article/dseoehd.html