div自适应浏览器宽度并居中的问题

几种实现方法，第一种是先写死宽度，然后根据页面宽度响应

@media screen and (min-width:1200px)
{ .top{width: 550px}.nav,.nav_bg{ width: 1100px; } }
 @media screen and (min-width: 960px) and (max-width: 1199px) 
{ .top{width: 480px}.nav.nav_bg{ width: 960px; } } 
@media screen and (min-width: 768px) and (max-width: 959px) 
{ .top{width: 450px}.nav.nav_bg{ width: 900px; } }
 @media only screen and (min-width: 480px) and (max-width: 767px)
{ .top{width:225px}.nav.nav_bg{ width: 450px; } }
@media only screen and (max-width: 479px) 
{ .top{width: 150px}.nav,.nav_bg{ width: 300px; }

位置什么的自己调整一下

另一种用一个调整自适应的插件，bootstrap之类的都行

希望有帮到您