块级标签包含行内标签底部出现3px间隔的解决办法

最新推荐文章于 2021-12-30 15:42:29 发布

weixin_34319111

最新推荐文章于 2021-12-30 15:42:29 发布

阅读量352

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/hellobajie/p/5800029.html

本文探讨了HTML中块级标签包含行内标签时出现的3px底部间隔问题，并提供了三种解决方案：设置外层标签字体大小为0、将内层图片标签转换为块级显示或者调整垂直对齐方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

当块级标签（如div）内包含了行内标签（如img），则外层元素与内层元素底部会出现3px的间隔；

代码如下：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        #box{
            background: red;
        }
    </style>
</head>
<body>
    <div id='box'>
        <img src="test.png">
    </div>
</body>
</html>