主页 / 建站知识 /

关于div中img,span垂直居中的问题

建站知识 2021-07-02 22:42www.168986.cn长沙网站建设

如下所示

XML/HTML Code复制内容到剪贴板
  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>  

请注意#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等这些块元素是无效的。

以上就是长沙网络推广为大家带来的关于div中img,span垂直居中的问题的全部内容了，希望对大家有所帮助，多多支持狼蚁SEO~

上一篇：浅谈HTML空链接的作用 下一篇：h5输入框提示语 + 正常文本框提示语的实现方法

长沙网站设计

Copyright © 2016-2025 www.168986.cn 狼蚁网络 版权所有 Power by