2012-09-14 64 views
2

enter image description here如何增加空間使用HTML/CSS

我要像橙色矩形內的那些HTML文檔中添加空間左右的網頁的。我不知道專業稱呼的技術術語。道歉。

+0

你想中心主文檔還是要以填補其他的事情,空間? – JaredMcAteer

+0

我想將文檔居中並將這些空間留空。 – AppSensei

+0

'浮動'這兩個廣告空間和'margin:auto'的主要內容 - 簡單! –

回答

4

CSS

.container { 
    margin:0 auto; /* this will center the page */ 
    width:960px; /* use your width here */ 
} 

HTML

<body> 
    <div class="container"> 
     <!-- all your great content here --> 
    </div> 
</body> 

如果您需要幫助將其應用到您的HTML/CSS,請發表您的HTML,我會很樂意幫助你。

+0

非常感謝你! – AppSensei

1

這些將是利潤。但是更好的選擇是將主區域打包成div或其他塊元素/切片根目錄,將其設置爲所需的寬度,然後將其居中放置margin: 0 auto;

+0

這意味着主要div的寬度必須是固定的,不會隨窗口變化的寬度改變... – Ian

+0

我的回答是一樣的天色現在upvoted之一,我不知道你怎麼樣誤解了它。 –

+0

是的,我也不同意。我認爲應該有填充 – Ian

0

您需要邊距。設置樣式爲margin:0 auto;如果您正在尋找居中你的網頁,並且使用你的主要容器上的固定寬度這樣可以容易地實現將圍繞你的DIV

5

爲什麼不這樣做呢? :

<style type="text/css"> 
    html, body { 
     margin: 0; 
     border: 0; 
     width: 100%; 
    } 

    body { 
     padding: 0 20px; 
    } 

    #main { 
     margin: 0 auto; /* in case you want to set a fixed width on this as well */ 
    } 
</style> 

<body> 
    <div id="main"></div> 
</body> 

這樣,根據窗口的寬度,主div將調整大小,並且總是會在兩側都有固定的空間。如果您希望主div具有固定寬度並且兩側的間距可自動調整大小,請使用其他解決方案。