如何判断选择器的优先级及权重

2024-01-18 15:28 小编

先来比较一下行内样式表及id选择器

代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>CSS选择器</title>

<style type="text/css">

#myColor{

color: blue;

}

</style>

</head>

<body>

<h3 style="color:red;" id="myColor">我是内容部分</h3>

</body>

</html>

行内的样式比id选择器的优先级要高,接下来我们再来比较一下id选择器及类别选器的样式。

代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>CSS选择器</title>

<style type="text/css">

.myStyle{

color: orange;

}

#myColor{

color: blue;

}

</style>

</head>

<body>

<h3 id="myColor">我是内容部分</h3>

</body>

</html>

实际操作得出结论,优先级别:行内的样式>id选择器>类别选择器。


Tag: 如何 选择
在线咨询 拨打电话

电话

13363039260

微信二维码

微信二维码