CSS-层模型覆盖问题-慕课网

CSS-层模型覆盖问题

来源：13-7 相对于自己的位置-层模型之相对定位

SAGEGSDAGESE

2016-03-28 18:01

#div1{
    width:200px;
    height:200px;
    background-color:red;
   border:2px red solid;
position:relative;
left:100px;
top:50px;
.div2{
    width:200px;
    height:200px;
    border:2px red solid;
}

</style>
</head>
<body>
   <div id="div1"></div>
    <div class="div2"><span>偏移前的位置还保留不动，覆盖不了前面的div没有偏移前的位置</span></div>

为什么红色背景的div1覆盖了后面的div2？不应该是后面的覆盖前面的吗？

写回答关注

2回答

vaughan

2016-03-28 18:52:36
首先你的div1缺少"}"，div2也应该用类选择器，还缺少了"position:absolute;"如果把这三个订正了再调整div2的位置就发现是div2覆盖div1了
0 0
weibo_转身_投降_0

2016-03-28 18:30:46

不知道我这个理解对不对，第二个框是相对第一个框移动（进行left:100px和top:50px）之前的位置按默认样式显示的，因为相对定位relative不脱离文档流。

0 0

初识HTML(5)+CSS(3)-升级版

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

1225808 学习 · 18234 问题

查看课程

相似问题

css层模型

回答 2

层模型移动问题

回答 3

层模型--固定模型

回答 5

HTML CSS 浮动模型问题

回答 1

层模型，绝对定位问题！

回答 3

打开慕课网App查看更多内容