<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>继承和层叠</title>
<style>
div {
color: chartreuse;
font-size: 20px;
border: 1px solid lightcyan;
height: 25px;
}
p {
background-color: fuchsia;
}
/*标签选择器的权重是1; . class选择器的权重是10;
* # id的权重是100;style的权重是1000;若权重相同,则谁最后写随就是颜色*/
#p1 {
border: 1px solid lightcoral;
width: 65px;
background-color: blanchedalmond;
}
.myp {
background-color: green;
}
/*!important无关权重,直接是最后的样式*/
div #p1 {
background-color: gold!important; }
p #p1 {
background-color: firebrick;
}
</style>
</head>
<body>
<div>
网页设计与制作
<p id="p1" class="myp" style="background-color: lightcyan;">喜欢好啊好啊</p>
</div>
</body>
</html>
继承和层叠
最新推荐文章于 2024-01-29 15:07:41 发布