IE6下解决text-align:center

最新推荐文章于 2020-04-01 18:25:21 发布

原创最新推荐文章于 2020-04-01 18:25:21 发布 · 218 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html

Css 专栏收录该内容

16 篇文章

订阅专栏

本文介绍了解决HTML表格在不同浏览器（IE与Firefox）中居中显示问题的三种方法，包括通过设置table的左右边距、使用特定浏览器前缀调整text-align属性以及采用HTML的<Center>标签。

Html代码  
<style type="text/css">  
.container{  
  text-align: center;  
  border: solid 1px blue;  
}  
</style>  
  
<div class=container>  
    <table>  
        <tr><td>Text</td></tr>  
    </table>  
</div>  

在IE下"Text"居中显示,FF下"Text"靠左显示.

二、解决问题:

方案1：

Html代码  
<style type="text/css">  
.container{  
  text-align: center;  
  border: solid 1px blue;  
}  
  
table {  
    margin-left:auto;  
    margin-right:auto;  
}  
</style>  
  
<div class=container>  
    <table>  
        <tr><td>Text</td></tr>  
    </table>  
</div>  

方案2：

Html代码  
<style type="text/css">  
.container{  
  text-align:-moz-center; /*FF*/  
  #text-align: center; /*IE */  
  border: solid 1px blue;  
}  
</style>  
  
<div class=container>  
    <table>  
        <tr><td>Text</td></tr>  
    </table>  
</div>  

方案3：

Html代码  
<style type="text/css">  
.container{  
  border: solid 1px blue;  
}  
</style>  
  
<center>  
<div class=container>  
    <table>  
        <tr><td>Text</td></tr>  
    </table>  
</div>  
</center>  