定位問題,yun
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>相對(duì)參照元素進(jìn)行定位</title>
<style type="text/css">
div{border:2px red solid;}
#box1{
??? width:200px;
??? height:200px;
??? position:relative;
??? left:20px;
??? top:20px;???? ?
}
#box2{
??? ?position:absolute;
?? ?top:20px;
?? ?left:30px;
???????? ?
}
/*下面是任務(wù)部分*/
#box3{
??? position:absolute;
??? bottom:30px;
??? left:0;
? ?
????????? ?
}
#box4{
??? width:99%;
??? ??? ?
?? ?
??? width:200px;
??? height:200px;
??? position:relative;
??? left:20px;
??? top:20px;
}
</style>
</head>
<body>
<div id="box1">
?? ?<div id="box2">相對(duì)參照元素進(jìn)行定位</div>
?? ?
</div>
<h1>下面是任務(wù)部分</h1>
<div id="box3">
?? ?
??? <div id="box4">當(dāng)我還是三年級(jí)的學(xué)生時(shí)是一個(gè)害羞的小女生。</div >
??? <img src="http://img1.sycdn.imooc.com//541a7d8a00018cf102000200.jpg">
</div>
</body>
</html>
box1中的relative 對(duì)box3中的absolute產(chǎn)生什么影響
2017-02-23
親，box3使用相對(duì)定位relative。box1也是相對(duì)定位relative，相對(duì)定位之間不影響吧。
即使box3使用絕對(duì)定位，也是必須要box3的父輩元素里面有相對(duì)定位才影響。
而box1不是box3的父輩元素。所以無論如何，他們沒有任何關(guān)系，沒有影響
2017-02-23
what is that ? i don't understand your description,?? please help me!
2017-02-23
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>相對(duì)參照元素進(jìn)行定位</title>
<style type="text/css">
div{border:2px red solid;}
#box1{
? ? width:200px;
? ? height:200px;
? ? position:relative;
? ? ? ? ??
}
#box2{
? position:absolute;
top:20px;
left:30px;
? ? ? ? ??
}
/*下面是任務(wù)部分*/
#box3{
? ? width:200px;
? ? height:200px;
? ? position:relative; ? ? ??
}
#box4{
? ? width:99%;
? position:absolute;
bottom:0;
? ??
}
</style>
</head>
<body>
<div id="box1">
<div id="box2">相對(duì)參照元素進(jìn)行定位</div>
</div>
<h1>下面是任務(wù)部分</h1>
<div id="box3">
? ? <img src="http://img1.sycdn.imooc.com//541a7d8a00018cf102000200.jpg">
? ? <div id="box4">當(dāng)我還是三年級(jí)的學(xué)生時(shí)是一個(gè)害羞的小女生。</div>
</div>
</body>
</html>