CSS特性(属性的继承和层叠)

.box{
    width:300px;
    background:pink;
}
img{
    /*width:100%; 方式一: 宽度会根据父级元素的变化而变化 */
    width: inherit; /* 方式二: 强制继承父元素的宽度 */
}

<div class='box'>
    <img src='./img/test.png'>
</div>

<div class='div1'>
    <div class='div2'>
        <div class='div3'>继承的是计算值</div>
    </div>
</div>

.div1{
    font-size:50px;
}
.div2{
    font-size:50%;  /* 25px */
}
.div3{
    font-size:inherit; /* 25px 此时继承的是父元素 div2 计算后的值 25px,而不是50%*/
}