div樣式在IE下margin:0 auto不居中多種解決方法

時間 2019-11-11

標籤 div 樣式 margin auto 居中多種解決方法欄目 CSS 简体版

原文原文鏈接

正常狀況下須要將div居中顯示時，使用Css樣式:margin:0 auto便可，但有時使用margin:0 auto後在FF、Chrome裏能居中，而在IE678裏不居中的現象。

正常狀況下須要將div居中顯示時，使用Css樣式:margin:0 auto便可，但有時使用margin:0 auto後在FF、Chrome裏能居中，而在IE678裏不居中的現象。css

以下代碼:
html

XML/HTML Code 複製內容到剪貼板

<style type="text/css">
#con{width:980px;martin:0 auto;}
</style>
<div id="con">margin: 0 auto 內容居中顯示</div>

解決方法一

能夠是對網頁主體<body>聲明文本居中，即body{text-align:center}
即:
spa

XML/HTML Code 複製內容到剪貼板

<style type="text/css">
body{text-align:center}
#con{width:980px;martin:0 auto;}
</style>
<div id="con">margin: 0 auto 內容居中顯示</div>

解決方法二

其實和解決方法一差很少，只是在要居中的div外層添加多一個div,並使其居中
即：
code

XML/HTML Code 複製內容到剪貼板

<style type="text/css">
#con{width:980px;martin:0 auto;}
</style>
<div style=「text-align:center」><div id="con">margin: 0 auto 內容居中顯示</div></div>

解決方法三

出現這個現象的緣由在於文檔的DTD聲明；
修改DTD爲htm

XML/HTML Code 複製內容到剪貼板

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

相關文章

相關標籤/搜索

三種方式解決

IE bug 解決辦法

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

最新文章

本站公眾號

歡迎關注本站公眾號,獲取更多信息

相關文章

>>更多相關文章<<