为什么宽度不覆盖最大宽度 [英] Why doesn't width override max-width

问题描述

如果我有以下代码

div{背景:粉色；高度:100px；最大宽度:20px；宽度:200px；}

结果是一个宽度为 20px 的 div.(即使我将 !important 添加到宽度值)

FIDDLE

为什么这里的 width 属性没有覆盖 max-width ?

解决方案

因为 max-width 比 width 具有更高的优先级.它的作用是防止元素的width从一定的边界开始增加.如果您希望 width 覆盖 max-width，则删除 max-width.

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

If I have the following code

<div></div>

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

The result is a div with width of 20px. (Even if I add !important to the width value)

FIDDLE

Why doesn't the width property override max-width here?

解决方案

Because max-width has more priority than width. Its function is to prevent width of an element to increase from certain boundaries. If you want width to override max-width then remove max-width.

A good link to refer given in comments

这篇关于为什么宽度不覆盖最大宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！