z-index权重问题

z-index是不是加上了! important后一定比没加的展示在更上层?例如1 !important和3000,是不是前者一定大于后者?

不是一码事,加import只是让它这个样式生效了,覆盖了其他相同的样式
如:

.div1{
  z-index: 1  !impprtant;
  z-index:99;
}
.div{
  z-index:  2;
}

这样的话,div1的zindex是1,设置99的虽然在下面,但是1加了important,所以1生效
而div2的zindex是2
所以div2还是在div1上面的

!important 用于提升某个直接选中标签的选择器中的某个属性的优先级的, 可以将被指定的属性的优先级提升为最高

<!--
 * @Author: your name
 * @Date: 2021-12-30 16:59:23
 * @LastEditTime: 2022-01-27 08:35:54
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: /未命名文件夹/123.html
-->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      p {
        z-index: 1 !important;
      }
      p {
        position: relative;
        z-index: 1000;
      }
    </style>
  </head>
  <body>
    <p>123123</p>
  </body>
</html>


img

简单点说,同一类名的,你使用important,那这个css样式的权重就是最高的,不是同一类名加了也没用