首页 > 网站 > WEB开发 > 正文

在DIV中图片垂直、水平居中,无须知道图片尺寸

2024-04-27 13:52:53
字体:
来源:转载
供稿:网友

在DIV中图片垂直、水平居中,无须知道图片尺寸

用到参数说明:

line-height: .
检索或设置对象的行高。即字体最底端与字体内部顶端之间的距离

IE不是必须的;IE认为文本文字对象到图片对象没有间距,而firefox与opera则认为有

兼容firefox必须,则图片边要添加  <img; 空格为文本字体对象,偷巧的一种办法与vertical-align:middle配合使用ff与op会把这些对象(包括图片)间距显示并居中显示

高度配合div高度使用



overflow:


检索或设置当对象的内容超过其指定高度及宽度时如何管理内容

hidden:不显示超过对象尺寸的内容

裁减过大的图片



margin-top: expression(( 160 - this.height ) / 2);

计算margin-top(margin-bottom)的高度

CSS行为expression控制实现,不过expression为IE独有,并且耗资源严重,尤其在大量使用的时候。

例:屏幕的居中显示 <div style="background:#f6f6f6; position:absolute; left:expression((body.clientWidth-150)/2); top:expression((body.clientHeight-150)/2);width:150px;;height:150px;"> ssssssssssssssssssssssss uhadjas<br /> </div>

补漏吧,line-height的特性



html>body div img{ vertical-align: bottom;}

html>body:子对象选择符

vertical-align:设置或检索对象内容的垂直对其方式.

FF与OP必须,配合line-height使用

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表