HTML/Html-Css/04-选择器权重.html
2023-05-01 19:37:40 +08:00

48 lines
1.8 KiB
HTML
Raw Permalink Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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>选择器权重</title>
<style>
* {
color: aqua;
}
#ip{
color: blanchedalmond;
}
p {
color: salmon;
}
.top-p {
color: blue;
}
</style>
</head>
<body>
<div id="app">
<div class="top">
<p class="top-p tp" id="ip"> <span>天地不仁</span> ,以万物为刍狗,圣人不仁,以百姓为刍狗。 </p>
</div>
<div class="bottom">
<p> <span>天地不仁</span> ,以万物为刍狗,圣人不仁,以百姓为刍狗。 </p>
</div>
<p> <span>天地不仁</span> ,以万物为刍狗,圣人不仁,以百姓为刍狗。 </p>
</div>
</body>
</html>
<!-- 标签选择器的权重 < class 选择器的权重 < id选择器的权重-->
<!-- 继承的样式的权重 < 通配符选择器的权重 < 标签选择器的权重 < class 选择器的权重 < id选择器的权重 -->