Jquery中文网 www.jquerycn.cn
Jquery中文网 >  CSS教程  >  经典实例  >  正文 css div 横向居中写法

css div 横向居中写法

发布时间:2020-05-14   编辑:www.jquerycn.cn
jquery中文网为您提供css div 横向居中写法等资源,欢迎您收藏本站,我们将为您提供最新的css div 横向居中写法资源

本文章就单独讲一下关于css教程 div 横向居中写法的用法,并且在ie,ie7,firefox兼容问题。

横向居中(centering)

  这是一个简单的技巧,但是值得再说一遍,因为我看见太多的新手问题都是问这个:css如何横向居中?您需要定义元素的宽,并且定义横向的margin,假如您的布局包含在一个层(容器)中,您可以这样定义使它横向居中:

#wrap {
width:760px; /* 修改为您的层的宽度 */
margin:0 auto;
}


  但是ie5/win不能正确显示这个定义,我们采用一个非常有用的技巧来解决:用text-align属性,就像这样:

body {
text-align:center;
}
#wrap {
width:760px; /* 修改为您的层的宽度 */
margin:0 auto;
text-align:left;
}


  第一个body的text-align:center; 规则定义ie5/win中body的所有元素居中(其他浏览器只是将文字居中),第二个text-align:left;是将#warp中的文字居左。

您可能感兴趣的文章:
EasySlider 基于jQuery功能强大简单易用的滑动门插件
javascript禁用浏览器滚动条的方法
基于jQuery实现的水平和垂直居中的div窗口
基于jquery的横向滚动条(滑动条)
Jquery图形报表插件 jqplot简介及参数详解
利用div+jquery自定义滚动条样式的2种方法
css浮动元素的居中的例子
jQuery弹出窗口完整代码(居中,居左,居右)
jqPlot 基于jquery的画图插件
jqPlot Option配置对象详解

[关闭]