当absolute没有祖先元素为除static的position时,是以body来定位,但是下面这个问题是怎么回事?
<style type="text/css">
body{
border:1px solid;
width: 500px;
margin: 0 auto;
}
#demo{
border:1px solid;
width: 300px;
height: 300px;
position: absolute;
left: 20px;
}
</style>
</head>
<body>
<div id="demo">
</div>
</body>
元素的定位会相对于其最近的已定位的父元素,最后不一定是Body。在这些回答中,给body 一个
background-color
,你发现整个页面都会有颜色,为什么呢?根元素
<html>
的背景即整个页面的背景。但如果其元素背景为默认值,即透明,就会取<body>
元素的背景作为其背景。可以参考 stackoverflow —— Applying a background to <html> and/or <body>