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

藏色散人
藏色散人原创
2023-01-28 11:13:33741浏览

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

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

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

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

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

3fe39a1542bbb3c9acaf4c905e1138d.jpg

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

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

推荐学习:《css视频教程

以上就是css 文字和图片对不齐怎么办的详细内容,更多请关注php中文网其它相关文章!

声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。