飞龙博客

飞龙博客 飞龙在天

浏览器ie层或table居中和Firefox层或table不居中解决方法

feilong.org 修订于2008-10-29 08:47:15 283 次浏览

相信很多网页设计师朋友在做页面元素比如div层或table表水平居中的时候,碰到这种情况:在ie里面显示是居中的,但是在firefox里就变左对齐了。这是ie与firefox浏览器解析css样式的区别,两者不完全兼容。参考网上资料后,飞龙决定总结一下ie浏览器里层table居中而Firefox浏览器里层table不居中解决方法,修订参考地址在:http://feilong.org/ie-Firefox-div-table-center,与朋友一起交流学习。

一、ie浏览器 层或table水平居中 最低要求
IE中在body中加入text-align:center,即可实现主布局块居中。
body{text-align:center}

二、FIREFOX浏览器 层或table水平居中 最低要求
飞龙现举例如下,分三种css实现方式,以第二种写法的css套用最自由:
#demo{margin:0 auto;}
<div id="demo">
</div>
或者
.demo{width:980px;margin:0 auto;}
<div class="demo">
</div>
或者内联{不提倡}
<div style="width:980px;margin:0 auto;">
</div>

三、因此想要让层或table在ie浏览器和FIREFOX浏览器都水平居中,只能鱼和熊掌兼得之哈。

body{text-align:center}
.demo{width:980px;margin:0 auto;}
<div class="demo">
</div>

id标记样式:
body{text-align:center}
#feilong{width:960px;margin:0 auto;}
<div id="feilong">
</div>

style嵌入样式,飞龙不提倡。

更新网址:https://feilong.org/ie-firefox-div-juzhong-duiqi
最初发布:20081029 08:47:15 feilong.org 于广州

加入收藏夹,查看更方便。

所在分类: 网站开发

新作:

旧文:

blog money bui 教程 echarts 教程 eclipse 教程 html css 教程 IT趋势 js 教程 json 教程 mysql 教程 nodejs npm 教程 onblog SQLite 教程 tutorials vscode 教程 wap网站 winpe启动盘 wordpress 主机推荐 书法 前端开发 博客 名企名网 国学 域名注册 常用软件 建站程序 操作系统 教程 数码 无线上网 日记 电子商务 电脑笔记本 网站 网站优化 网站开发 网站推广 网站策划 网络 虚拟现实 默认