calc是什么意思?怎么使用?本篇文章给大家带来的内容是介绍css3中的calc()
函数是什么,有什么用,如何使用。有一定的参考价值,有需要的朋友可以参考一下,希望对你们有所帮助。
首先小编在这里谢谢大家一直的支持,每天都会更新十个web前端基础内容,需要的可以关注我,另外也可以进我的web学习交流群1045267283,领取资料学习资料笔记,可以跟里面的小伙伴一起学习一起成长,不懂的问题也可以问我,随时给大家解答。再次感谢大家。
css3中的calc()是什么?可以做什么?
calc()
从字面看我们可以把它理解为一个function函数。其实calc就是英文单词calculate(计算)的缩写;它是一个css3新增的功能,可以用来指定元素的长度,动态计算长度值。
在CSS3中calc()函数可以允许我们对属性值执行数学运算。
例如,我们可以使用calc()函数指定宽度值为两个或更多数值相加的结果,而不是把元素宽度值声明为一个静态像素值。
.demo {
width: calc(100px + 50px);
}
为什么要使用calc()?
如果你使用过像sass这样的css预处理器的话,那么你可能会遇到如下的例子:
.demo{
width: 100px + 50px;
}
// 使用SASS变量
$width-one: 100px;
$width-