老师，关于max-width和min-width滴问题？
来源：3-5 height属性
shine62
2019-01-26 09:36:42
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
p{/*width: 400px*/;background-color: yellow}
.two{min-width: 500px;}
.three{max-width:600px;}
.four{min-width: 500px;}
.five{min-width: 500px;max-width: 600px;}
.six{min-width: 500px;max-width: 400px;}
</style>
</head>
<body>
<p>我爱你</p>
<p class="two">第二个</p>
<p class="three">第三个</p>
<p class="four">第四个</p>
<p class="five">第五个</p>
<p class="six">第六个</p>
</body>
</html>
老师，我的class six设置的是min-width 是500；最大值是400；最终显示的便是500了；难道说最小值还能大于最大值吗？可是class.five当设置成min-width是500；max-width是600时，显示的便是600了；不明白为什么结果就不一样了？可不可以理解为：当最小值大于最大值时，宽度就按照最小值来表现；而最大值大于最小值时，宽度就按照最大值来体现？
3回答
-
不是哦，浏览器的宽度指的值，显示器的内侧宽度，参考下图：
橘色线条勾画的区域就是浏览器的的宽度，可以在浏览器上测试下。
0h019-01-28 -
shine62
提问者
2019-01-27
老师，这里的浏览器大于500px，是指给p元素本身定义的宽度吗？
0 -
山河远阔ZZ
2019-01-27
同学你好，当max-width的值为600，min-width的值500，如果浏览器大于500px的话，读取的就是max-width600，如果浏览器小于500的话，读取的就是500px；当最小值大于最大值时，宽度就按照最小值来表现；
希望帮助到了你，欢迎采纳！
祝学习愉快！0h019-01-27
相似问题