为什么宽度不覆盖最大宽度

Question

如果我有以下代码

<div></div>

div
{
    background: pink;
    height: 100px;
    max-width: 20px;
    width: 200px;    
}

结果是一个宽度为 20px 的 div。（即使我添加!important到宽度值）

小提琴

为什么这里的 width 属性不覆盖 max-width ？

Answer 1

因为max-width比 具有更高的优先级width。它的功能是防止width元素从某些边界增加。如果要width覆盖，max-width则删除max-width.

评论中给出的一个很好的参考链接