因为img绝对p相对,p的盒子大小已经设定了,如果没设定,p的盒子大小就是内容撑起。
那为什么相对定位删了(删后效果:所有位置都没变只有文字分别被两个图片覆盖),绝对定位的图片还和p有绝对定位一样,位置没变:因为绝对定位没设数值且前面有块元素挡着。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
img{
position: absolute;
}
p{
word-wrap: break-word;
position: relative;
width: 427px;
height: 416px;
}
</style>
</head>
<body>
<div>
<img src="http://image.zhangxinxu.com/image/study/s/s256/mm1.jpg" alt="">
<p>enenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenenen</p>
</div>
<img src="http://image.zhangxinxu.com/image/study/s/s256/mm1.jpg" alt="">
<p class="re">中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文中文</p>
</body>
</html>
来源:oschina
链接:https://my.oschina.net/u/2444023/blog/744650