CSS3计算盒子宽度

CSS3计算盒子宽度

CSS3的calc()函数可以让CSS属性值执行一些计算:
width:calc(100%-20px;)
该函数可以执行+-*/
<style>
    .father {
        width: 300px;
        height: 200px;
        background-color: salmon;
    }

    .son {
        width: calc(100%-30px);
        height: 30px;
        background-color: seagreen;
    }
</style>

<!-- 子盒子宽度永远比父盒子小30像素 -->
<div class="father">
    <div class="son"></div>
</div>
分享到 :
CSS3图片模糊处理
上一篇 2020-08-22
CSS3新增属性过渡
2020-08-22 下一篇

发表评论

登录... 后才能评论