为啥消失了

来源:2-11 编程练习

weixin_慕斯卡3305140

2020-02-21 00:34:09

为什么设置了位置relative,元素直接消失了

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <style>

        *{

            padding: 0;

            margin: 0;

        }

        .test{

            position:relative;

            /*position:absolute;*/

            width: 100px;

            height: 100px;

            background: red;

            /*此处写代码*/

            right:200px;

            bottom:100px;

    

        }

     </style>

</head>

<body>

    <div class="test"></div>

</body>

</html>


写回答

1回答

好帮手慕星星

2020-02-21

同学你好,因为设置了方位值

http://img.mukewang.com/climg/5e4f6b7b097133d207360480.jpg

相对定位是根据自身位置进行移动的,默认在左上角显示,设置bottom属性为100px,也就是移动后的位置距离默认位置底部有100px,所以会向上移动;left也是一样的道理,所以会看不到元素。

而绝对定位是相对于页面位置来说的,效果不一样,自己可以再测试理解下。

如果我的回答帮到了你,欢迎采纳,祝学习愉快~

0
heixin_慕斯卡3305140
h 意思是相对原本他的位置移动,设置right和bottom 元素就像左上移动跑出去了是吗?
h020-02-21
共1条回复

0 学习 · 40143 问题

查看课程