span标签内文字没有留在原处

来源:13-7 相对于自己的位置-层模型之相对定位

慕粉3841721

2016-12-12 19:30

所以设置成relative和不设置span标签内的文字的位置应该是不动的,但是我加上position:relative;    top:50px;    left:100px;这段代码以后span标签内的文字也跟着移动了,是为什么呢

写回答 关注

3回答

  • qq_小雏菊_3
    2016-12-12 19:44:02
    已采纳

    因为relative是相对于之前的容器定位的,若span是其之前的容器,则会跟着移动

    GaryHa... 回复李珂_

    <div id="div1"><span>balabala..</span></div>则会移动,放在容器div外部是不受影响的

    2017-02-05 11:15:16

    共 3 条回复 >

  • 慕粉3841721
    2016-12-12 19:43:48

    <!DOCTYPE HTML>

    <html>

    <head>

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

    <title>relative样式</title>

    <style type="text/css">

    #div1{

        width:200px;

        height:200px;

    border:2px red solid;

       position:relative;

        top:50px;

        left:100px;    

    }

    </style>

    </head>

    <body>

    <div id="div1"><span>偏移前的位置 还保留不动 ,覆盖不了前面 的 div 没有偏移 前 的 位置 </span></div>

    </body>

    </html>


  • emily973
    2016-12-12 19:39:39

    贴代码看看

初识HTML(5)+CSS(3)-升级版

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

1228936 学习 · 19082 问题

查看课程

相似问题