这种图标定位方式遇到relative是否会失效?

来源:4-1 图片图标绝对定位覆盖

尘土_zb

2016-08-11 19:30

后期别人在他的父元素或祖宗辈儿的元素上加了relative这个absolute定位是不是仍然会被破坏掉啊?

写回答 关注

3回答

  • qq_換個方向前進_03604091
    2016-08-12 12:10:26
    已采纳

    <!doctype html>

    <html>

    <head>

    <meta charset="utf-8">

    <title>left/right拉伸和width同时存在</title>

    <style>

    div{

    position: relative;

    }

    .image {

        position: absolute; left: 0; right: 0; width: 50%; 

    }

    .button {

    padding-top: 200px;

    }

    .button input {

    width: 280px; height: 40px;

    font-size: 20px;

    }

    </style>

    </head>


    <body>

    <div>


    <img class="image" src="http://img.mukewang.com/547c34c9000171a002560191.jpg" height="191">

    <p class="button">

    <input type="button" value="添加margin: auto;" onClick="document.getElementsByTagName('img')[0].style.margin = 'auto';">

    </p>

    </div>

    </body>

    </html>



    尘土_zb

    非常感谢!

    2016-11-04 21:18:02

    共 1 条回复 >

  • 慧女神
    2016-08-29 20:13:02

    不会的。因为他是用margin来定位的,就算后期你给父元素加入relative属性,对absolute元素也没影响,除非你给absolute元素添加了left、top,这个影响就是常用的父元素relative对子元素absolute的影响

  • PARADISELIN
    2016-08-16 17:08:53

    同问同问

CSS深入理解之absolute

理解CSSposition:absolute声明,掌握position:absolute高级应用

51953 学习 · 262 问题

查看课程

相似问题