----关于position的四个标签----

从【 two1-4 】分别为absolute,fixed,static,relative标签

四个标签下位移值相同,【 two2 】和【 two1 】都出现在左上角,【 two2 】 盖住了【 two1 】

附上部分源代码:

  HTML:

    <div class="box" id="one">One</div>
    <div class="box" id="two1">Two1</div>
    <div class="box" id="three">Three</div>
    <div class="box" id="four">Four</div>

  CSS:

    .box {
    display: inline-block;
    width: 100px;
    height: 100px;
    background: #ff8353;
    color: white;
    }

    

    #two1 {
    position: absolute;
    top: 20px;
    left: 20px;
    background: #452589;
    }

    body
    {
    height:4000px;
    }

----关于position的四个标签----

two4 】为relative标签,出现在正常流当中,能设置位移

two3 】为static标签,出现在正常流当中,不能设置位移

two2 】为fixed标签,不出现在正常流当中,不能设置位移,随页面滚动

two1 】为absolute标签,不出现在正常流当中,能设置位移

----关于position的四个标签----

如图的【 two2 】为fixed标签页面滑动效果

上一篇:Qt环境搭建(Qt Creator)


下一篇:关于eclipse的一些问题