WD1X.COM - 问答一下,轻松解决,电脑应用解决专家
主板显卡CPU内存显示器
硬盘维修显卡维修显示器维修
注册表系统命令DOS命令Win8
存储光存储鼠标键盘
内存维修打印机维修
WinXPWin7Win11Linux
硬件综合机箱电源散热器手机数码
主板维修CPU维修键盘鼠标维修
Word教程Excel教程PowerPointWPS
网络工具系统工具图像工具
数据库javascript服务器
PHP教程CSS教程XML教程

清除浮动和图片水平垂直居中

更新时间:2012-11-03 16:43 作者:佚名点击:

1、如何清除浮动

方法1:

#test{clear:both;}
#test为浮动元素的下一个兄弟元素

方法2:

#test{display:block;zoom:1;overflow:hidden;}
#test为浮动元素的父元素。zoom:1也可以替换为固定的width或height

方法3:

#test{zoom:1;} #test:after{display:block;clear:both;visibility:hidden;height:0;content:'';}
#test为浮动元素的父元素

2、如何让未知尺寸的图片在已知宽高的容器内水平垂直居中?

#test{display:table-cell;*display:block;*position:relative;width:200px;height:200px;text-align:center;vertical-align:middle;} #test p{*position:absolute;*top:50%;*left:50%;margin:0;} #test p img{*position:relative;*top:-50%;*left:-50%;vertical-align:middle;}
#test是img的祖父节点,p是img的父节点。

顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
你可能感兴趣的内容