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

最近使用float发现一个子元素超出包含块的情况,不知道如何解释

最近使用float发现一个子元素超出包含块的情况,不知道如何解释

Robert_Langdon 2017-01-02 23:01:18
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>title</title> <style type="text/css"> div{border:1px red solid;} #box1{     width:400px;     height:400px;           } #box2{     float:right; } #box3{     position:absolute; } </style> </head> <body> <div id="box1">     <div id="box2">          <div id="box3">               相对参照元素进行定位          </div>     </div> </div> </body> </html>代码如上显示,运行后子元素会跑到包含块儿外面(如图所示),这不符合我对float的理解,不过我发现如果对box2的div设置width值,子元素就不会跑出去了,我不知道应该如何解释这个现象,有没有大神可以解答,谢谢。
查看完整描述

2 回答

?
为伊落得心憔悴

TA贡献3条经验 获得超1个赞

position:absolute;是相对于position:relative;,并且如果你不设置top和left的话,是最右边开始是最初的位置。

查看完整回答
1 反对 回复 2017-01-03
?
echo_kinchao

TA贡献600条经验 获得超86个赞

绝对定位默认是左上角 但是你的box1给了宽度 所以他就会跟着前方的元素挨着

查看完整回答
1 反对 回复 2017-01-03
  • 2 回答
  • 1 关注
  • 3247 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信