为什么我们在宽度属性中写入calc？宽度：100％ - 80px; = width：calc（100％ - 80px）;

Question

为什么我们在宽度属性中写入calc？ 宽度：100％ - 80px; = 宽度：calc（100％ - 80px）;这里 <div>any text here</div>
和CSS这里 HTML

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

}

Answer 1

您的示例代码告诉我们您的div宽度小于其容器100％的10px。你会怎么做呢？如果你的父容器是100％宽（你不知道它实际上有多宽（在流体设计中）），但是你确实知道你希望它比它的父亲小10px。

要回答你的问题，为什么？有很多*不同的原因，为什么和每个人都会有那种“为什么”更重要的意见。它更好地调查它如何被使用，并决定何时使用它。

Answer 2

因为否则旧的浏览器可以治疗 “100％ - 10px的” 为 “100％”，或在不寻常的方式失败。使用calc（）以前的浏览器将会更好地失败并确保兼容性。这是典型的CSS/html ...我们总是与过去作斗争。