DIV 居中的絕好解決方法
更新時間：2006年11月04日 00:00:00 作者：
現(xiàn)在進行WEB重構(gòu)的時候,一般我們做DIV 居中是這樣:
body{
margin:0px auto;
text-align:center;
}
但是在沒申明下面這句解析方法的時候,頁面就會出錯.不能居中對齊!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
為此困擾了我?guī)滋?那么有的朋友就會說:你加上這句不就行了嗎? 可是有時候頁面并不能全部按上面規(guī)定的代碼格式來編寫,比如說要改多彩滾動條.
直到昨天,一個想法在我腦中閃了一下. 何不用JS來控制頁面的邊距?說干就干!
找了個頁面.添加了下面的一小段代碼.
<script language="javascript" type="text/javascript" src="function.js"></script>
function.js內(nèi)容:
if(window.screen.width>800){document.write("<style type=\"text/css\">body{margin-left:"+(window.screen.width-800)/2+"px}</style>");}
保存,測試. 哈哈,換了幾個分辨率都可以正常居中!至此試驗成功.
總結(jié)一下:
主要是這句代碼起的作用:
(window.screen.width-800)/2 //計算頁面應(yīng)該留出的邊距數(shù)值.800為我的DIV寬度 + 滾動條寬度.實際應(yīng)用改為你自己的大小.
補充一點:上面這段JS 必須放在你的最后一個CSS連接或</style>的后面.
歡迎大家到我的小站交流更好的實現(xiàn)方法!
復(fù)制代碼 代碼如下:
body{
margin:0px auto;
text-align:center;
}
但是在沒申明下面這句解析方法的時候,頁面就會出錯.不能居中對齊!
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
為此困擾了我?guī)滋?那么有的朋友就會說:你加上這句不就行了嗎? 可是有時候頁面并不能全部按上面規(guī)定的代碼格式來編寫,比如說要改多彩滾動條.
直到昨天,一個想法在我腦中閃了一下. 何不用JS來控制頁面的邊距?說干就干!
找了個頁面.添加了下面的一小段代碼.
復(fù)制代碼 代碼如下:
<script language="javascript" type="text/javascript" src="function.js"></script>
function.js內(nèi)容:
復(fù)制代碼 代碼如下:
if(window.screen.width>800){document.write("<style type=\"text/css\">body{margin-left:"+(window.screen.width-800)/2+"px}</style>");}
保存,測試. 哈哈,換了幾個分辨率都可以正常居中!至此試驗成功.
總結(jié)一下:
主要是這句代碼起的作用:
復(fù)制代碼 代碼如下:
(window.screen.width-800)/2 //計算頁面應(yīng)該留出的邊距數(shù)值.800為我的DIV寬度 + 滾動條寬度.實際應(yīng)用改為你自己的大小.
補充一點:上面這段JS 必須放在你的最后一個CSS連接或</style>的后面.
歡迎大家到我的小站交流更好的實現(xiàn)方法!
相關(guān)文章
關(guān)于target="_blank"去留的問題在網(wǎng)上已經(jīng)被反復(fù)爭議很多次了。有的說要留，有的說要去掉。主張留的一方主要是考慮到target="_blank"的屬性目前來講還沒有一個好的方式來解決，而主張去的一方則拿出了rel與JS的解決方案。2008-06-06
就是將flash的參數(shù)，向下面的方法修改，即可解決2008-07-07
更多的關(guān)于css強制換行 css強制不換行的css方法可以參考本站的內(nèi)容頁的文章控制.2007-12-12
推薦一篇利用th,colgroup,col定義表格樣式...2007-04-04
實用的利用 CSS + <em>標簽 來完成一個三角形的制作
實用的利用 CSS + <em>標簽 來完成一個三角形的制作...2007-04-04
昨天在使用css結(jié)合div布局的時候碰到了一個問題。 在一個規(guī)定寬度大小的ul里邊 我把li的寬度定義為自動。企圖讓li根據(jù)內(nèi)容長度來自動向左對齊排列。2008-07-07
(X)HTML Strict 下的嵌套規(guī)則...2007-02-02
無js5款純div+css制作的彈出菜單標準...2007-09-09
web標準常見問題集合2...2006-11-11
