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

子元素采用absolute定位,父元素没有设置高度,可是为什么仍然子元素会被撑开?

子元素采用absolute定位,父元素没有设置高度,可是为什么仍然子元素会被撑开?

shine62 2019-03-05 18:50:28
如果我没有设置绝对定位的话,不给html,body设置{height:100%,weight:100%}时,单独的给下面包裹的div设置height,width:50%时,div的高度是有里面的字体撑开的,它的高度不是窗口的一半。按照我们理解的那样,以百分比的形式给某个元素设置高度时,它是继承上一级父元素的高度。可是absolute,在以body做爹爹的时候,body的高度也是没有设定的呀,为什么就可以占满屏幕的一半呢?代码如下:<!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <title>Title</title>     <style>         * {             margin: 0;             padding: 0;         }        body{background:yellow;}         div {             height: 50%;             width: 50%;             background: red;             color: white;             position: absolute;         }     </style> </head> <body> <div>     你是最棒的哦! </div> </body> </html>如图:去掉absolute之后:为什么添加absolute之后就可以自动充满屏幕的一般呢?而如果没有absolute的话,高度是自适应文字的,它自己给定高度无效,这点可以明白,上面不太懂。
查看完整描述

1 回答

?
带咸鱼

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

body默认就是整个窗口啊 那里面div就占一半了啊   不设absolute那啥没有宽高了就内容撑开 设了就默认参照body的宽高

查看完整回答
反对 回复 2019-03-05
  • 1 回答
  • 0 关注
  • 7382 浏览
慕课专栏
更多

添加回答

举报

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