<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>max-width</title> <style> .main { max-width: 700px; border: 1px solid red; margin: 0 auto; } </style> </head> <body> <div class="main"> 在这种情况下使用 max-width 替代 width 可以使浏览器更好地处理小窗口的情况。<br /> 这点在移动设备上显得尤为重要，调整下浏览器窗口大小检查下吧！<br /> 顺便提下， 所有的主流浏览器包括IE7+在内都支持 max-width ，所以放心大胆的用吧。 </div> </body> </html>
结果：
调整浏览器的窗口，div宽高自动缩放，真是很棒啊。