網頁製作 css讓頁面居中對齊

2022-09-25 15:54:13 字數 703 閱讀 2769

總結一下css讓頁面居中對齊的方法

1.我們常用的margin:0 auto;方法

這個方法是大家用的最多的方法,使用的時候必須為容器制定寬度!

例子:#main

這個在大部分瀏覽器裡面都可以很好的實現效果。

但是在ie6之前的版本中卻不被支援,下面看一下第二種方法

2. 用text-align實現居中,這個方法其實算是乙個hack。

這個方法把整個頁面當作文字對待,把body的屬性設定為

這樣的話頁面所有內容全部居中了,還需要把頁面總的外框(wrap)屬性

這樣的話頁面就居中了!

**:body

wrap

3.負的外邊距

負外邊距需要和絕對定位同時使用,才會生效。

首先需要乙個來包裹所有的頁面內容,並將其定位到頁面的50%。這樣容器據瀏覽器左邊50%的距離。

然後再用負邊距,將容器左邊距設定程式設計客棧為寬度的一半即可。

看**:

#wrap

這樣wrap就居中對齊了,這個方法基本上可以相容所有的瀏覽器了。

綜上所述ffkppbhgu:第一種方法是我們大家首選的解決方案,第二種方法其實可以和第一種程式設計客棧方法結合起來用更好,第三種方法是是可以相容所有的瀏覽器,如果你對你的也頁面相容性要求的高些,這個也可以作為你的首選哈!

本文標題: 網頁製作 css讓頁面居中對齊

本文位址:

css 高階 對齊 居中

除非已經宣告了 doctype,否則使用 margin auto 在 ie8 以及更早的版本中是無效的。margin 水平對齊 如果寬度為100 對齊無效 水平居中 right float 左右對齊 右對齊 right position 定位對齊 右對齊 right 垂直居中 垂直 水平居中 cen...

如何讓div頁面居中 讓div在頁面居中的方法

在頁面 最上面加上 再把div的style加上 margin 0 auto dflzzp dflzzp 如果無法運用.來設定層居中.出現這樣問題可能是沒有加hmlt的 2,嚴格型 3,框架型 如果對css 2.0標準不太熟悉不要使用嚴格型的dtd.我們現在使用過渡期的就行了 在網頁最頂剖加上 萬物都...

讓DIV CSS製作的網頁居中,很簡單的方法 原

我寫網頁是包在乙個叫 container 的div中的,所以這裡主要講一下body與 container之間的關係。先看一下body的css樣式 body 這裡的body把margin與padding設定為0,這樣就把body內容與瀏覽器邊緣親密接觸。然後text align center 把bod...