CSS样式表优先级

CSS样式表优先级前端入门学习笔记(持续更新中)以下结论仅基于浏览器的表现,不涉及深层原理,有待深入。 行内样式VS内部样式、链接样式、导入样式 *结论:行内样式优先级最高 内部样式VS链接样式 …

大家好,又见面了,我是你们的朋友全栈君。

CSS样式表优先级

1. 以下结论仅基于浏览器的表现,不涉及深层原理,有待深入。
2. 本文的"优先级"仅为最后样式体现的描述,不与常规定义等同。
  1. 行内样式 VS 内部样式、链接样式、导入样式

    CSS样式表优先级 CSS样式表优先级 CSS样式表优先级 CSS样式表优先级 CSS样式表优先级 CSS样式表优先级

    *结论:行内样式优先级最高

  2. 内部样式 VS 链接样式

    CSS样式表优先级 CSS样式表优先级

    CSS样式表优先级 CSS样式表优先级

    *结论:就近原则——最靠近相关标签的样式优先级高

  3. 内部样式 VS 导入样式

《CSS权威指南》:
@import一定要写在除@charset外的其他任何CSS规则之前,如果置于其他位置将会被浏览器忽略,而且,在@import之后如果存在其它样式,则@import之后的分号是必须书写,不可省略的。”

CSS样式表优先级 CSS样式表优先级

*结论:内部样式比导入样式优先级高(或者说覆盖)

  这里因为导入样式的特殊性,不能进行两种样式的交换的优先级比较。当然,如果进行交换,依然以内部样式为准。

  • 4. 链接样式 VS 导入样式

    CSS样式表优先级 CSS样式表优先级 CSS样式表优先级 CSS样式表优先级

    *结论:就近原则——最靠近相关标签的样式优先级高

  • 总结论:

    1. 行内样式优先级最高;
    2. 内部样式优先级大于导入样式,而与链接样式的优先级则与文档顺序有关,越靠近相关标签的样式优先级越高,即遵循就近原则。
    3. 导入样式与链接样式的优先级也遵循就近原则。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/158973.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • idea 2021激活码破解方法

    idea 2021激活码破解方法,https://javaforall.net/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

    2022年3月15日
    56
  • 如何学习游戏编程?

    如何学习游戏编程?如何学习游戏编程开发

    2022年6月21日
    23
  • 【C语言】输入两个正整数m和n,求其最大公约数和最小公倍数。(要求用while语句实现)[通俗易懂]

    【C语言】输入两个正整数m和n,求其最大公约数和最小公倍数。(要求用while语句实现)[通俗易懂]输入两个正整数m和n,求其最大公约数和最小公倍数。(要求用while语句实现)一、最大公约数求法(1)辗转相除法(2)相减法二、求最小公倍数算法一、最大公约数求法(1)辗转相除法设有两整数a和b:①a%b得余数c②若c==0,则b即为两数的最大公约数③若c!=0,则a=b,b=c,再回去执行①。例如求27和15的最大公约数过程为:27÷15余1215÷12余312÷3余0因此,3即为最大公约数。(2)相减法设有两整数a和b:①若a>b,则a=a-b②.

    2022年5月16日
    50
  • c比python快多少倍_python和c++哪个简单

    c比python快多少倍_python和c++哪个简单国外有测试指出在相同复杂度算法中,C++约比Python快50倍左右。因此Python适合上层应用;C++则适合底层控制。本文介绍如何让C++和Python形成优势互补

    2022年10月5日
    2
  • 【玩转嵌入式屏幕显示】(六)ST7789 SPI LCD硬件垂直滚动功能的使用

    一、想法萌生小熊派开发板的LCD小屏幕使用是ST7789驱动IC,之前一直有在该块屏幕上实现滚动显示的想法,最初构想在MCU侧创建一个大的队列,将整个屏幕显示内容交由队列管理,然后不停的去整屏刷新以实现屏幕滚动。理论上这样的实现比较耗资源,耗费CPU资源去操作SPI外设,耗费内存资源去存储显示数据,所以一直没有去做这件事。今天在查看ST7789数据手册写论文时,偶然发现ST7789手册种:咦?Scroll?滚动?发现新大陆!根据手册中的8.14章节描述,旋转滚动仅仅是垂直滚动的一种模式,由垂

    2022年4月8日
    83
  • 使用Ubuntu搭建Web服务器

    使用Ubuntu搭建Web服务器Docker是一个开源的应用容器引擎,基于Go语言并遵从Apache2.0协议开源。Docker可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中,然后发布到任何流行的Linux机器上,也可以实现虚拟化。容器是完全使用沙箱机制,相互之间不会有任何接口(类似iPhone的app),更重要的是容器性能开销极低。总而言之,Docker相当于在你的电脑上建了一个虚拟机…

    2022年5月28日
    30

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号