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

position:absolute;的问题

<html>

  <head>

    <style>

        #box3{

            width:200px;

            height:200px;}

        #box4{

            width:99%;

            }

    </style>

  </head>

  <body>

        <div id="box3">

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

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

 </body>

</html>

如果我在box4的css中加入position:absolute;的话,我的文字会由之前有固定宽度的样式变成一行字,是不是因为absolute会使元素脱离块的缘故呢?

正在回答

5 回答

因为你在box3中没有设置position:relative,所以你的box4在加入了position:absolute后,只是相对于浏览器进行的定位,而不是相对于box3进行的定位

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

那是因为你没有BOX3中设置position:relative,需要以他为参照

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

<html>

  <head>

    <style>

        #box3{

            width:200px;

            height:200px;

            position:relative;

            }

        #box4{

            width:99%;

            position:absolute;

            bottom:0px;

            }

    </style>

  </head>

  <body>

        <div id="box3">

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

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

 </body>

</html>


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

不是因为脱离的缘故

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

box3,相对于bpx4是父元素,如果你要把字体移到图片上面,就要对父元素设置绝对位置,对子元素设置相对位置

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

慕前端8310374

你说反了吧!?
2016-05-10 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

position:absolute;的问题

我要回答 关注问题
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号