萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> DivCSS教程 >> DIV+CSS制作的網頁如何讓網頁居中

DIV+CSS制作的網頁如何讓網頁居中

 我寫網頁是包在一個叫 #container 的DIV中的,所以這裡主要講一下BODY與#container之間的關系。

    先看一下body的CSS樣式:

    body{ margin:0;padding:0;text-align:center;}

    這裡的body把margin與padding設置為0,這樣就把body內容與浏覽器邊緣親密接觸。然後text-align:center 把body的內容全部居中,這樣就包括了#container也一起居中了。

    再來看一下#container的樣式:

    container{width:760px;margin:0 auto;text-align:left;position:relative;}

    學問就在這個#container裡了: 給這個容器設定了寬度,這裡是760px,margin:0 auto; 這裡的margin中的第一個0是上下、第二個auto是左右。上下為0左右讓其自控。再加上定位為相對,只有定位為相對的元素才可以有位置移動!

copyright © 萬盛學電腦網 all rights reserved