10、样式选择器权值

最新推荐文章于 2022-10-10 09:07:41 发布

五仁卤鸡翅

最新推荐文章于 2022-10-10 09:07:41 发布

阅读量292

点赞数 1

分类专栏： css 文章标签： css css3

本文链接：https://blog.csdn.net/MoonNight608/article/details/106853448

版权

css 专栏收录该内容

50 篇文章 0 订阅

订阅专栏

文章目录

介绍
样式选择器权值

介绍

本文是在学习CSS时做的学习笔记，所有笔记内容为 CSS学习笔记

样式选择器权值

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>meta</title>
</head>
<style>
#box1{
    color:green
}
div{
    color:red
}
.red{
    color:red
}

样式冲突，
    -通过不同的选择器，选中相同的元素，并且为相同的样式设置不同的值
    此时就发生了样式的冲突
 
发生样式冲突时，应用那个样式由选择器的权重（优先级）决定 
选择器的权重
   内联样式          1,0,0,0
   id选择器          0,1,0,0
   类和伪类选择器     0,0,1,0
   元素选择器         0,0,0,1
   通配符选择器         0，0，0，0
   继承的样式         没有优先级
   
   比较优先级时，需要将所有选择器的优先级进行相加计算，最后优先级越高，则
   越优先显示。
   注意，分组选择器是单独计算的
   选择器的累加，不会超过其最大的数量级，比如，类选择器累加再高也不会超过id选择器
   
   一般，选择器越具体，优先级越高
   
   如果，选择器优先级相同，则优先使用靠下的样式，即后声名的选择器覆盖前边的选择器
   
   !important 表示赋予最高优先级，超过内联样式。
      注意，在开发中，一定要慎用
</style>
<body>
  <div id="box1" class="red" >我是一个div</div>     
</body>
</html>

五仁卤鸡翅

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
10、样式选择器权值

文章目录介绍样式选择器权值介绍本文是在学习CSS时做的学习笔记，所有笔记内容为 CSS学习笔记样式选择器权值<html lang="en"><head> <meta charset="UTF-8"> <title>meta</title></head><style>#box1{ color:green}div{ color:red}.red{ color:red
复制链接

扫一扫

专栏目录