Rumah > Artikel > hujung hadapan web > 在div中img,span怎样可以做出垂直居中

在div中img,span怎样可以做出垂直居中

php中世界最好的语言asal: 2018-01-20 09:59:137460semak imbas

这次给大家带来在div中img,span怎样可以做出垂直居中，在div中img,span做出垂直居中的注意事项有哪些，下面就是实战案例，一起来看一下。

<html>  
<head>  
<style>  
#test *{vertical-align:middle;}   
</style>  
<body>  
<div  
id="test">  
<img  
src="http://127.0.0.1:7001/wsc/images/message.png"/>  
<span>sdfhsdhfdksfjhtes:</span>  
</div>  
</body>  
</html>

请注意：#test *{vertical-align:middle;}s

#test *表示了div里面所有元素,当然包含了span,input,img这些内联元素了。

vertical-align
初始值：　baseline（缺省值）
可否继承：否
适用于：　内联元素
说明：vertical-align:baseline使元素的基线同父元素的基线对齐．
警告：vertical-align不能影响表格单元中的内容的对齐，对于块元素中的内容也一样．

请注意：vertical-align只影响内联元素,比如span,img,em,input,a等这些元素，而对div,h3,p等这些块元素是无效的。

相信看了这些案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

Artikel berkaitan

Lihat lagi