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)
全栈程序员-站长的头像全栈程序员-站长

相关推荐

  • 大数据开发工作累吗?

    大数据开发工作累吗?在大数据时代的背景下,出现了另一类程序员—大数据开发工程师,他们因为掌握着前沿的大数据相关技术,深受企业重视,找工作容易收入也非常高,但作为IT行业的又一分类,是否加班牵动了无数转行者的心!对于大数据开发工作是否加班的这个问题,不能一概而论,需根据公司的实际情况而定,有些公司有加班的氛围,即使非IT岗,也会有加班的情况,这样的公司大数据开发肯定会加班无疑的;有些公司不鼓励加班,会根据大数据开发…

    2022年6月2日
  • Linux下用户和组的管理

    Linux下用户和组的管理

    2021年4月14日
  • Python如何生成exe文件?用Pycharm一步一步带着你学(超详细、超贴心)

    Python如何生成exe文件?用Pycharm一步一步带着你学(超详细、超贴心)目的描述:为了让没有安装Python的人也能使用我们编写的.py文件,我们需要将编写好的Python程序生成.exe文件。第一步下载pyinstallerpyinstaller插件是Python自带的插件,用于为我们写好的代码进行打包,最终自动合成.exe文件。在Pycharm界面的最下面,你可以看到Terminal,选择这个选项,这就是一个终端界面。在此界面写输入指令:pipin…

    2022年6月11日
  • Loadrunner教程–常用操做流程

    Loadrunner教程–常用操做流程Loadrunner教程–常用操做流程作者博客:vps精选网1loadrunner压力测试一般使用流程1.1loadrunner压力测试原理本质就是在loadrunner上模拟多个用户同时按固定行为访问web站点。其中固定行为在loadrunner中是通过录制脚本定义的,多个用户同时访问的策略是在loadrunner的场景中定义的。1.2压测思路…

    2022年5月23日
  • 【Java基础】异常?NullPointException?世界上怎么会存在这种东西?

    【Java基础】异常?NullPointException?世界上怎么会存在这种东西?异常太难顶了啊,简直是程序员的噩梦

    2022年11月1日
  • C#-TextBox-登录窗口密码不可见—ShinePans[通俗易懂]

    C#-TextBox-登录窗口密码不可见—ShinePans[通俗易懂]usingSystem;usingSystem.Collections.Generic;usingSystem.ComponentModel;usingSystem.Data;usingSystem.Drawing;usingSystem.Linq;usingSystem.Text;usingSystem.Windows.Forms;namespaceTextB

    2022年7月18日

发表回复

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

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