CSS最大宽度

使用 width, max-width 和 margin: auto;

如前一章所述; 块级元素总是占用可用的全部宽度 (尽可能延伸到左边和右边).

置块级元素的width将阻止它伸出到容器的边缘. 然后，可以将边距设置为auto，将容器内元素水平居中.元素将占用指定的宽度,余的空间将平分两个边:

这个 <div> 元素宽度是 500px, margin 是 auto.

注意: 使用 <div> 当浏览器窗口小于元素的宽度时，将发生一个问题. 然后浏览器添加水平滚动条到页面.

这种情况下，使用 max-width 代替, 会提高浏览器对小窗口的处理. 这是重要的，当使网站小型设备时:

这个 <div> 元素有一个500px `max-width` , margin 设置是 auto.

提示：调整浏览器窗口的大小小于500px宽，看一下之间的区别！

这里是上面的两个div例子：

div.ex1 {
    width: 500px;
    margin: auto;
    border: 3px solid #73AD21;
}

div.ex2 {
    max-width: 500px;
    margin: auto;
    border: 3px solid #73AD21;
}

让我试试