CSS常用的两个函数
1. 计算 calc()
这个感觉是最常用也最实用的的一个方法。 这个函数，可用在如，左右布局，一边宽度固定，另一边撑开左右宽的情景。 calc() 函数用于动态计算长度值。 语法：
calc(数学表达式)， 如：width:calc(100% - 20px);
<style>
.calc{
font-size: 10vw;
overflow: hidden;
}
.calc .left{
float:left;
width:calc(100% - 20vw);
background: #d0b6ea;
}
.calc .right{
float:right;
width:20vw;
background: #b39dca;
}
</style>
<div class="calc">
<div class="left">z</div>
<div class="right">wk</div>
</div>
在这里插入图片描述
2.attr() 获取标签属性
attr(属性名) 获取当前所在选择器的标签的属性值，参数就是属性名，不用加引号。
<style>
.attr a:after{
content:'(' attr(href) ')'
}
</style>
<div class="attr">
<a href="abc.html">abc</a>
</div>
在这里插入图片描述
注：还有很多CSS函数，除了这两个外，大部分是关于颜色渲染方面的函数，业务逻辑中我很少用到，但是这两个CSS函数对我们的帮助很大。
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录