解决img幽灵空白节点的方案

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <style>

            img{width: 235px;}

            .base{

                background-color: red;

                font-size: 0;  /* 解决空白幽灵方案二 */

            }

            /* 解决空白幽灵方案一: */

            /* img{display: block;} */

        </style>

    </head>

    <body>

        <h3>幽灵空白节点</h3>

        <div class="base">

            <img src="10.jpeg" />

        </div>

    </body>

</html>

猜你喜欢

转载自blog.csdn.net/weixin_51747462/article/details/128741120