1.!important是一个修饰符，他的语法是K:V !important;
错误写法：
.box1 !important{ };
K:V;！important
2.!important只能提升一条语句的优先级， 不能提升一个选择器的优先级。
3.!impotent能将一条语句的优先级提升到无穷大.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.box1{
color: green;
}
#d1{
color: red;
}
p{
color: orange !important;
}
</style>
</head>
<body>
<p id="d1" class="box1">文字颜色</p>
</body>
</html>
4.如果有层叠的语句都使用!important修饰，那么将按照语句所在选择器的权重大小来起作用。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.box1{
color: green !important;
}
#d1{
color: red;
}
p.box{
color: orange !important;
}
</style>
</head>
<body>
<p id="d1" class="box1">文字颜色</p>
</body>
</html>
第一个选择器和第三个有!important属性，排除第二个，第一个权重大，最后显示绿色.
5.如果是继承过来的样式，他的权重为0，加上!important属性权重仍为0，即!important不能提升权重为0的样式。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.box1{
color: green !important;
}
p{
color: orange ;
}
</style>
</head>
<body>
<div class="box1">
<p >文字颜色</p>
</div>
</body>
</html>
此时显示橙色文字。
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
