话不多说,直接开始干货输出
1. 浏览器的默认样式,
2. 用户样式表
3. style中编写的样式代码
4. 样式优先级
第一,浏览器默认样式表
Because浏览器自带一个默认的样式,如果html中没有为标签设置样式,则浏览器会按照自己的样式来显示。但是浏览器默认样式的级别是最低的,一旦其他地方设置了标签样式,浏览器默认样式就会被干掉,从而页面发生改变。
浏览器默认样式的清除:
*{margin:0;
padding:0;
}
拿字体来说,各个浏览器默认的字体种类、字体大小和字体行高都不一样,所以我们需要统一设置默认的字体样式,以便实现一致的显示效果来保证我们前端开发设计的一致性和整体开发效率。
第二,用户样式表
用户定义样式表的目的是让Web冲浪者的首选项影响查看Web的方式。这对于某些特殊群体的用户特别有用,包括那些有视觉障碍的用户。例如,如果用户要求高对比度显示,用户样式表应该设置为默认的黑色背景、白色文本和大字体。
第三,style中编写的样式代码
第四,<a style=’ ’>中编写的样式代码
行内样式,比如
<a style="color:red;font-size: 18px;" href="###">DEMO</a>
在这里插入代码片
下面比较重要的点,大家额外需要注意
第四:样式优先级
通常我们看到的页面的样式都会受到三层层级控制:
- 第一层是浏览器的默认样式
- 第二层是网页定义样式
- 第三层是用户自定义样式
和CSS一样,后面的优先级 高于前面的,也就是说网页定义样式可以覆盖浏览器的默认样式,而用户自定义样式优先级最高。不过,当有 !important 时,网页样式可以覆盖用户自定义样式。用户!important > 网页!important > 用户 > 网页 > 浏览器默认。 这就是优先级排序的问题
今天的博文更新到这里,最近工作忙,有懈怠情况大家见谅