固定寬度的CSS內聯塊

Question

我正在嘗試學習設計網站。

1. 有什么辦法可以將當前響應式粘性頁腳設置為1000px ？
2. 如果可能，在上述條件之上，我希望左右div水平對齊，並且當屏幕折疊時div將變為垂直對齊。

這是我的html / css代碼：

的jsfiddle

Answer 1

添加max-width:1000px; 到.wrapper類，並使.content類為float:left

.wrapper {
    margin: 0;
    height: auto; 
    max-width:1000px; /*add this line*/
}

.content {
    background-color: slateblue;
    width: 500px;
    float:left; /*add this line*/
}

演示在 http://jsfiddle.net/Sp2ZW/

Answer 2

你的意思是這樣的：

http://jsfiddle.net/S3hMH/1/

html, body {
    margin: 0 auto;
    display: table;
    height: 100%;
    width: 100%;
    width: 1000px;
}

.content {
    background-color: slateblue;
    width: 500px;
display: inline-block;
    float:left;
}

Answer 3

小提琴

如果您對響應式設計還比較陌生，我建議使用框架作為

基礎 引導

來問你的問題。

1. 是您可以將頁面寬度設置為1000px。

    #wrapper{ margin: 0 auto; width: 100%; max-width: 1000px; } .content{ width: 50%; float:left; } 

   @media screen and (max-width: 480px) { .content{ width:100%; } }

如果由於上述查詢而導致屏幕分辨率小於480px，則內容將占據100％的寬度，並水平堆疊。使用％width可以幫助您設計響應式網頁