一旦瀏覽器大小足夠大，將CSS框移動到網頁的中心位置？

Question

我注意到很多網站從Facebook到stackoverflow，大多數元素都有一個固定的高度和寬度，並放置在距頁面左邊界一定距離處。但是，一旦頁面被拉伸，所有元素一起移動到網頁中更中心的位置。如何在Html和CSS中僅僅使用幾個框元素來執行？

任何幫助非常感謝 在此先感謝。

Answer 1

您只需要爲容器設置最大寬度並應用邊距：0 auto;到它，它會自動錶現如此。

http://jsfiddle.net/ast53pu7/

<div class="container"> 
    <div id="center">This will center</div> 
</div> 


.container{ 
    width:100%; 
    background:#ddd; 
    padding:100px 0; 
} 

#center{ 
    background:#fff; 
    padding:20px; 
    max-width:300px; 
    margin:0 auto; 
} 

這是響應網頁設計。

Answer 2

他們使用CSS媒體查詢可能

Answer 3

這就是所謂的「自適應網頁設計」或短的「後輪驅動」。