div内图片宽度100%,div设置margin后右侧溢出解决办法

div内图片宽度100%,div设置margin后右侧溢出解决办法

如下图:

div内图片宽度100%,div设置margin后右侧溢出解决办法

代码如下:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <style>
        .item {
            width: 100%;
            margin: 10px;
        }
        .item img {
            width: 100%;
        }
    </style>
</head>
<body>
    <div>

        <div class="item">
            <img src="http://repo.bfw.wiki/bfwrepo/image/01_classic.jpg" />
        </div>

    </div>
</body>
</html>

其实解决的办法很简单,将item的width去掉即可

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <style>
        .item {
          
            margin: 10px;
        }
        .item img {
            width: 100%;
        }
    </style>
</head>
<body>
    <div>

        <div class="item">
            <img src="http://repo.bfw.wiki/bfwrepo/image/01_classic.jpg" />
        </div>

    </div>
</body>
</html>

div内图片宽度100%,div设置margin后右侧溢出解决办法

{{collectdata}}

网友评论0