CSS—内联样式（⾏内样式）、内部样式、外部样式、选择器⽂章⽬录
⽹页分为： 结构（html） 表现（CSS） ⾏为（JavaScript）
CSS
简介
层叠样式表
⽹页实际时⼀个多层的结构，通过CSS可以分别为⽹页的每⼀个层来设置样式，但⽤户看到的只有最上层。
CSS⽤来设置⽹页中元素的样式
使⽤CSS修改元素样式⽅式
⽅式⼀（内联样式或⾏内样式）
在标签内部通过通过style属性来设置元素的样式
效果：
缺点：使⽤内联样式，只能对⼀个标签⽣效，如果多个元素想达到同意效果，需要逐⼀设置style属性。cssclass属性
⽅式⼆（内部样式表）
将样式编写到head中的style标签⾥
通过CSS的选择器来选中元素并为其设置各种样式
可同时为多个元素设置样式，修改时只需要修改⼀处即可全部应⽤内部样式表更加⽅便对样式进⾏复⽤
书写位置：< head >标签中
效果：
缺点：只能在同⼀页⾯使⽤，不能跨页⾯使⽤CSS中的样式
⽅式三（外部样式表）全场最佳
可以将CSS样式编写到⼀个外部的CSS⽂件中
通过link标签引⼊外部的⽂件
可跨⽹页使⽤，引⽤link就⾏
可以使⽤到浏览器的缓存机制，从⽽加快浏览器的缓存机制，加快⽹页的加载速度，提升⽤户体验书写位置：< head >标签中
效果：
选择器
通过选择器可以选中页⾯中的指定元素，⽐如 p 的作⽤就是选中页⾯中所有的 p 元素
元素选择器
根据标签来选中指定的元素
语法：标签名{}
例如： p{}， h1{}，div{}
id选择器（id不能重复，即使出现相同效果）
当多个 p 元素中，只修改⼀个 p 元素的样式时：通过 id 选中⼀个元素语法：#id属性值{}
例如：#box{}，#red{}
类选择器（class：与id作⽤相似，但是可重复）
根据class属性值选中⼀组元素
可以为同⼀元素指定多个class属性
语法：.class属性值
通配选择器
选中页⾯中的所有元素
语法：*
交集选择器
选中同时符合多个条件的元素
语法：选择器1选择器2选择器3选择器n{}
交集选择器中如果有元素选择器，必须使⽤元素选择器开头
并集选择器（选择器分组）
同时选择多个选择器对应的元素
语法：选择器1，选择器2，选择器3，选择器n{}
例如：#b1，.p1，h1，span，d{} 表⽰选中id为b1，class为p1，h1，span和class为red的div。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。