<!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>
span {
color: red;
}
span {
color: blue
}
body .txt {
color: pink;
}
.txt {
color: yellow;
}
/*
选择器权重 *<标签名1g<类名1kg
选择器权重可以叠加
*/
div {
font-size: 100px;
font-style: normal;
font-weight: bold;
font-family: "楷体";
color: red;
/* 隐藏标签 */
/* display: none; */
}
i {
font-style: normal;
}
a {
color: red
}
</style>
</head>
<body>
<!-- 层叠性:
css同样的样式,权重一样的话后写的生效
权重不一样,取决于权重高的
继承性:
与文字有关的样式,都可以继承
如果一个标签没有某一个与文字有关的样式(一定要考虑到内置的一些样式),会向上寻找,直到找到该样式,
-->
<span class="txt">第三方斯蒂芬 </span>
<div>
<p>
<span>
<a href="">文字</a>
<i>文字</i>
</span>
</p>
</div>
</body>
</html>
效果图
层叠性:
css同样的样式,权重一样的话后写的生效
权重不一样,取决于权重高的
继承性:
与文字有关的样式,都可以继承
如果一个标签没有某一个与文字有关的样式(一定要考虑到内置的一些样式),会向上寻找,直到找到该样式,