图片底部空白缝隙的问题解决方法
发布时间
阅读量：
阅读量
文章结构概述
-
-
- 1.识别存在的错误
- 2.处理并修正错误
- 1.识别存在的错误
-
1.Bug识别与定位
bug描述 ：通常情况下，图片会被封装在一个容器内，然而在图片下方默认会出现一段空白区域。
原因 ：行内块元素的排列方式会与文字的基线保持一致。
我们来观察这个bug:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>精灵图</title>
<style>
* {
margin: 0px;
padding: 0px;
}
.container {
border: 1px solid black;
}
</style>
</head>
<body>
<div class="container">
<img src="images/img.jpg" />
</div>全部评论 (0)
还没有任何评论哟~