- Objective:
- Breadcrumb:
# 概念阐释
- 限制一个“内容”的最大宽度
- 如果内容大于「最大宽度」会被限制在最大宽度下
- 如果内容小于「最大宽度」则没有影响
# 实例
这行代码，图片会在浏览器缩小后与旁边的字重叠，为什么？
```html
<img class="img-responsive" width="250" height="150" src="images/menu/B/B-1.jpg" alt="Item">
```
因为图片被定义为响应式图片`img-responsive`, 等同于自动适应浏览器页面，所以图片会“自适应”放大，因此将放置图片的容器样式，属性里添加max-width。
```CSS
.image {
max-width:250px;
}
```
# 相关内容
类比于box-sizing属性，都是用于控制内容不因浏览器放大或默认参数而失控。
`min-width`：定义最小宽度，通常一起用。
# 参考资料