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

修改box4的bottom 无论数值大小都会跑到框3的下面,修改left没有反应

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>相对参照元素进行定位</title>

<style type="text/css">

div{border:5px red solid;}

#box1{

    width:200px;

    height:100px;

    position:relative;

          

}

#box2{

  position:absolute;

top:10px;

left:10px;

          

}

/*下面是任务部分*/

#box3{

    width:200px;

    height:200px;

     position:relative;      

}

#box4{

    width:94%;

  position:absolute;

bottom:;

    left:10;

}

</style>

</head>


<body>

<div id="box1">

<div id="box2">相对参照元素进行定位</div>

</div>


<h1>下面是任务部分</h1>

<div id="box3">

    <img src="http://img1.sycdn.imooc.com//541a7d8a00018cf102000200.jpg">

    <div id="box4">当我还是三年级的学生时是一个害羞的小女生。</div>

</div>

</body>

</html>


正在回答

7 回答

在源代码上把#box4{

position:relative;

    bottom:40px;

}加上这两句就可以了我是这样弄的

0 回复 有任何疑惑可以回复我~
#1

越自律_越自信_越自由 提问者

非常感谢!
2017-07-11 回复 有任何疑惑可以回复我~

box4的bottom不要空着,写个0就行应该能行

0 回复 有任何疑惑可以回复我~

ralative是根据当前的位置进行的偏移,absolute是根据父元素的位置进行的偏移。不知道对不!

0 回复 有任何疑惑可以回复我~

不要忘记在数字后面加px.  感觉那里 relative 和absolute无所谓

0 回复 有任何疑惑可以回复我~

不要忘记在数字后面加px.  感觉那里 relative 和absolute无所谓

0 回复 有任何疑惑可以回复我~

哇。。。你的代码怕是遇鬼了,明明和我的一样,但是却显示的不一样。楼主你明白后给我讲讲?

0 回复 有任何疑惑可以回复我~
#1

越自律_越自信_越自由 提问者

你可以把你的代码给我发一份吗?
2017-07-11 回复 有任何疑惑可以回复我~
#2

越自律_越自信_越自由 提问者

应该是要在数字后面加px.
2017-07-11 回复 有任何疑惑可以回复我~

没有啊,我复制你的代码进去,是可以改的

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

修改box4的bottom 无论数值大小都会跑到框3的下面,修改left没有反应

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信