您當(dāng)前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁(yè)設(shè)計(jì)教程 >> 移動(dòng)前端 >> 瀏覽設(shè)計(jì)教程

關(guān)于div中img,span垂直居中的題目

如下所示:

XML/HTML Code復(fù)制內(nèi)容到剪貼板
  1. <html>  
  2. <head>  
  3. <style>  
  4. #test *{vertical-align:middle;}   
  5. </style>  
  6. <body>  
  7. <div  
  8. id="test">  
  9. <img  
  10. src="http://127.0.0.1:7001/wsc/images/message.png"/>  
  11. <span>sdfhsdhfdksfjhtes:</span>  
  12. </div>  
  13. </body>  
  14. </html>  

請(qǐng)細(xì)致:#test *{vertical-align:middle;}s

#test *透露表現(xiàn)了div里面所有元素,當(dāng)然包含了span,input,img這些內(nèi)聯(lián)元素了。

vertical-align
初始值: baseline(缺省值)
可否繼續(xù):否
適用于: 內(nèi)聯(lián)元素
說(shuō)明:vertical-align:baseline使元素的基線(xiàn)同父元素的基線(xiàn)對(duì)齊.
警告:vertical-align不能影響表格單元中的內(nèi)容的對(duì)齊,對(duì)于塊元素中的內(nèi)容也一樣.

請(qǐng)細(xì)致:vertical-align只影響內(nèi)聯(lián)元素,比如span,img,em,input,a等這些元素,而對(duì)div,h3,p等這些塊元素是無(wú)效的。

以上就是小編為大家?guī)?lái)的關(guān)于div中img,span垂直居中的題目的悉數(shù)內(nèi)容了,盼望對(duì)大家有所幫助,多多支持圖趣網(wǎng)~

[教程作者:佚名]
免責(zé)聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉(zhuǎn)載,請(qǐng)注明出處,素材資料僅供個(gè)人學(xué)習(xí)與參考,請(qǐng)勿用于商業(yè)用途!
本文地址:http://m.likemindfilms.com/tutorial/wd3346.html
淺談HTML空鏈接的作用
h5輸入框提醒語(yǔ) + 正常文本框提醒語(yǔ)的實(shí)現(xiàn)方法
圖趣網(wǎng)微信
建議反饋
×