CSS样式优先级顺序

最新推荐文章于 2024-06-16 17:29:19 发布

FlashCanSavetheWorld

最新推荐文章于 2024-06-16 17:29:19 发布

阅读量523

点赞数

分类专栏： JavaWeb

本文链接：https://blog.csdn.net/qq_45141428/article/details/108738615

版权

JavaWeb 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

CSS 7 种基础的选择器(内嵌样式)：

ID 选择器，如 #id{}
类选择器，如 .class{}
属性选择器，如 a[href=“segmentfault.com”]{}
伪类选择器，如 :hover{}
伪元素选择器，如 ::before{}
标签选择器，如 span{}
通配选择器，如 *{}

  <head>
  <style type="text/CSS">
      选择器{
          属性1:属性值1;
          属性2:属性值2;
          属性3:属性值3;
      }
  </style>
  </head>

  <Style>
      div{
          colr:red;
          font-size:20px;
      }
  </style>

内嵌样式优先级关系： ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器

行内式（内联样式）

  <标签名 style="属性1:属性值1; 属性2:属性值2; 属性3:属性值3;">内容</标签名>

外部样式（外链式）

  <head>
  <link rel="stylesheet" type="text/css" href="css文件路径"/>
  </head>

!important关键字>行内式(内联样式)>内嵌样式表>外部样式表

FlashCanSavetheWorld

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
CSS样式优先级顺序

选择器的优先级上面讨论了一个标签从祖先继承来的属性，现在讨论标签自有的属性。在讨论 CSS 优先级之前，先说说 CSS 7 种基础的选择器：ID 选择器，如 #id{}类选择器，如 .class{}属性选择器，如 a[href=“segmentfault.com”]{}伪类选择器，如 :hover{}伪元素选择器，如 ::before{}标签选择器，如 span{}通配选择器，如 *{}优先级关系：内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类
复制链接

扫一扫

专栏目录