CSS 最大宽度
-
使用width, max-width和margin: auto;
如前一章所述,块级元素总是占用可用的全宽(尽可能向左和向右延伸)。设置块级元素width将阻止它伸展到其容器的边缘。然后,您可以将margin设置为auto,以使元素在其容器内水平居中。元素将占用指定的宽度,剩余的空间将在两个边距之间平均分配:
此<div>元素的宽度为500px,边距设置为auto。注意:当浏览器窗口比元素的宽度小。浏览器向页面添加水平滚动条。使用max-width替代,在这种情况下,将改善小窗口浏览器的处理。使网站在小型设备上可用,这一点很重要:
此<div>元素的最大宽度为500px,边距设置为auto。提示:将浏览器窗口的大小调整为小于500px宽,以查看两个div之间的差异!
尝试一下div.ex1 { width:500px; margin: auto; border: 3px solid #73AD21; } div.ex2 { max-width:500px; margin: auto; border: 3px solid #73AD21; }