为什么我们在 width 属性中写 calc？宽度：100% - 80px； = 宽度：计算（100% - 80px）；答案

【问题标题】：why we write calc in width property? width:100% - 80px; = width:calc(100% - 80px);为什么我们在 width 属性中写 calc？宽度：100% - 80px； = 宽度：计算（100% - 80px）；
【发布时间】：2015-07-11 00:40:57
【问题描述】：

为什么我们在 width 属性中写 calc？宽度：100% - 80px； = 宽度：计算（100% - 80px）； html在这里 <div>any text here</div>
和这里的 css

div{
background:#f00;
width:calc(100% - 10px);
padding:30px;

}

【问题讨论】：

为什么？因为有时您想将相对尺寸与绝对尺寸混合在一起，而唯一的方法就是计算...

标签： html css calc

【解决方案1】：

您的示例代码告诉我们，您的 div 宽度比其容器的 100% 小 10 像素。否则你会怎么做？

如果您的父容器是 100% 宽（您不知道它实际上有多宽（在流体设计中））但您确实知道您希望它比其父容器小 10px。

回答你的问题，为什么？有许多不同的原因，每个人都会对哪个“为什么”更重要有意见。最好调查一下它是如何使用的，然后决定何时使用它。

【讨论】：

【解决方案2】：

因为否则旧版浏览器可能会将“100% - 10px”视为“100%”或以不寻常的方式失败。使用 calc() 较旧的浏览器会更正确地失败并确保兼容性。这是典型的css/html……我们总是在和过去作斗争。

【讨论】：