码迷,mamicode.com
首页 > 其他好文 > 详细

7.vertical-align属性

时间:2019-11-24 21:05:39      阅读:64      评论:0      收藏:0      [点我收藏+]

标签:bsp   ima   img   span   16px   col   目标   解决办法   cal   

本节学习目标:

图片、表单和旁边的文字对齐

解决图片底部默认空白缝隙问题

1.图片、表单和旁边的文字对齐

默认的图片、表单等行内元素或行内快元素是和文字的基线对齐的,但在实际情况下,我们想让他们中间对齐或底部对齐,这时我们可以设置vertical-align属性

技术图片技术图片

 

 vertical: top|middle|base|bottom

 2.解决图片底部默认空白缝隙问题

因为我们的图片默认是和文字的基线对齐的,如若我们给图片加边框,那么图片底部和边框中间会默认留一部分空隙。

解决办法:

  • 设置vertical属性(只要不是base就可以)
  • 把图片转化为块级元素

7.vertical-align属性

标签:bsp   ima   img   span   16px   col   目标   解决办法   cal   

原文地址:https://www.cnblogs.com/731856167qqcom/p/11924218.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!