width：min-width和max-width

当我们只设置width时，如100px,显示结果如下图：

.container { 
background-color: red; 
height: 100px; 
width: 100px; 
max-width: 50px 
} 

这时如果我们同时设置了max-width:50px，则max-width的值会覆盖width的值，container显示为50px,如下图所示：

.container {
background-color: red;
height: 100px;
width: 100px;
max-width: 150px
}
但是如果我们设置max-width:150px,那么width的值会覆盖max-width的值，container显示为100px,如下图所示：

.container {
background-color: red;

height: 100px;
width: 100px;
max-width: 50px;
min-width: 120px
}
再设置min-width:120px,则min-width的值会覆盖width的值，container显示为120px,如下图所示：

优先级：min-width>width和max-width

当三个属性都设置时，相当于取Math.max(min-width, Math.min(width, max-width))