父元素设好后能影响子元素
我感觉就是先有一个大的<div style="">括在外面,然后里面再夹一个小的<span>,
或者一个大的<ul style="">括在外面,然后里面夹一个小的<li>,这样就是继承
<!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>
#mydiv{
color:red;
border:1px solid red;
font-size: 30px;
}
span{
color:initial; /* 使用浏览器默认样式 , 不接受父标签传入的属性值*/
border:inherit; /* 主动向父元素申请获得这个样式的父元素配置*/
font-size: initial;
}
/*
任何一个样式都有2种值,一种叫inherit,一种initial
浏览器给每个标签的所有样式都赋值了,叫做浏览器默认样式。
*/
</style>
</head>
<body>
<div id="mydiv">
abcdefg
<span>xyzxyz</span>
</div>
</body>
</html>
最终最后”#.....顺丰“的文字将不会使用12px的大小,而是使用浏览器的默认li标签的文字大小。