为了账号安全,请及时绑定邮箱和手机立即绑定

急急急 求解ablosute


<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>绝对定位</title>
    <style type="text/css">
        *{
            margin:0;
            padding:0;
        }
        
         .box1{
            background-color: #ddeef6;
            width:100%;
           height:100px;
        }
        .box2{
            background-color: pink;
            width:100%;
             height:100px;
             position:absolute;
        }
        .box3{
            background-color: purple;
            width:100%;
           height:100px;
        }
        
    </style>

</head>
<body>
<div>box1</div>
<div>box2</div>
<div>box3</div>
</body>
</html>

为啥加上position:absolute;这一句,box3就不显示了呢

我见老师的显示的挺好的呢,求解

正在回答

1 回答

1 你代码标签没有类名

2 未设置偏移量,决定定位元素会保留在初始位置,并脱离文档流。所以box2在文档流之外,box3占据box2位置而上移,box2在初始位置又脱离文档流,所以盖住了box3.    视频里讲有,再看。

0 回复 有任何疑惑可以回复我~
#1

老铁牛

补充:别忘了你自己设置宽度为100% 绝对定位元素 在未设置时是随内容改变宽度。绝对定位打错了 打成决定定位了。。。​
2015-10-21 回复 有任何疑惑可以回复我~
#2

liaochen09 提问者

非常感谢!
2015-11-03 回复 有任何疑惑可以回复我~

您的类名没有添加呢

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
网页布局基础
  • 参与学习       214672    人
  • 解答问题       1833    个

让你精通CSS中三大定位机制,彻底掌握网页布局的相关知识

进入课程

急急急 求解ablosute

我要回答 关注问题
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号