Question

当我设置margin-right：50px;我没有看到任何影响，但是当我更换边距时：50px;保证金左：50px;或margin-top：50px;我确实看到了效果。这是带有margin-right的代码......

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Max Pietsch homepage</title>
        <style type="text/css">
        .me {
            margin-right: 20px;
        }
        #pic_of_me {
            width: 200px;
        }
    </style>
</head>
<body>
    <div class="me">
        <img id="pic_of_me" src="me.jpg" alt="A picture of me">
    </div>
</body>

Answer 1

Html元素默认情况下在其父元素的左上角全部对齐。

您的.me因此位于body元素的左上角。

如果你添加margin-top或margin-left你的.me“将自己推离这个角落（这就是你看到它移动的原因）。

如果您在元素右侧/下方添加margin-right或margin-bottom个其他元素，则会被“推”掉。

由于元素右侧/下方没有任何元素，您无法看到此效果。

尝试一下！

为什么保证金权利不起作用，但保证金左，保证金最高和保证金最低？

1 个答案: