关于css calc函数的一些说明

calc函数，主要作用是用于动态计算长度，例如：

width:calc(100% - 50px);

上面这句话代表宽度width为浏览器可视区域宽度减去50px。

calc可以用于某些不好计算的数值。

calc函数很多浏览器都已经兼容了

calc支持  + -  *  /  操作符,它允许使用数学表达式。

注意：calc函数（）里面的操作符必须用空格空开，

//关于使用的时候的一些自己遇到坑

今天我在做东西的时候遇到一个三列布局，要求中间固定，两边自适应。我使用了calc函数

width:calc((100% - 1200px) / 2 );

成功解决。

但是后来发现了一个问题。在缩小浏览器窗口的时候，两边的width会变小直到消失。但是我们不能让他完全消失

这是因为，100%的宽度是浏览器可视区域窗口。当浏览器窗口变小，100%所表示的实际长度也在变小。当小于1200px的时候，两边的宽度几消失了。

对于这种情况，我们需要设置最小高度，或者padding,给两边的盒子一些最小宽度。

width: calc((100% - 1200px) / 2 );
min-width: 100px;

像这样，就解决了