css 文字和图片对不齐怎么办

作者: 南枫晔
来源: 51数据库
2023-02-07

css文字和图片对不齐的解决办法：1、打开相应的HTML文件；2、找到文字和图片标签部分；3、给图片添加一条属性为“img {width: 20px;vertical-align: middle;}”即可使文字和图片对齐。

本教程操作环境：Windows10系统、HTML5&&CSS3版、DELL G3电脑

css 文字和图片对不齐怎么办？

css解决文字和图片不在一条水平线上

通常情况下图片是默认顶部对齐，而文字则是默认底部对齐的，所以我们在布局时经常会遇到图片和文字不能对齐的问题。

解决方法很简单我们只需要给图片添加一条属性即可

img {
  width         : 20px;
  vertical-align: middle;
}
 
vertical-align: text-top;    //顶部对齐
vertical-align: middle;      //居中对齐
vertical-align: text-bottom; //底部对齐

推荐阅读

热点文章