zoukankan      html  css  js  c++  java
  • 绝对定位

    1.absolute元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框。

    2.绝对定位的元素的位置相对于最近的已定位祖先元素,如果元素没有已定位的祖先元素,那么它的位置相对于最初的包含块。

    3.absolute定位的margin定位其实是不冲突的,他们可以同时作用,不管有没有设置定位值,他都是会对margin值敏感的。

    <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <style>
            #div1
            {
                width: 300px;
                height: 300px;
                background: red;
           margin-left: 20px;
    } #div2 { width: 100px; height: 100px; background: yellow; position: absolute; left: 25px; margin: 50px 0 0 50px; } </style> </head> <body> <div id="div1"> <div id="div2"></div> </div> </body> </html>

    通过在firebug中查看,他们那两个定位置是加在一起的,之前没有设置left值时,就只有margin值。第二次我加上了left值之后,他就又往右移了25px。同时该实例也说明了absolute是相对于有定位的父元素,在这里div1是没有定位的,他是相对于body来说的。

  • 相关阅读:
    随机生成4位验证码(包含数字, 字母)
    eval注册和登录
    51单片机中断机制(定时器/计数器)
    CS106B
    机器学习算法之旅(转载)
    Ubuntu系统使用记录
    2. 自然语言处理预备知识
    1. 自然语言处理描述
    前端学习网站
    2016年总结,2017年计划
  • 原文地址:https://www.cnblogs.com/zhuni/p/4721418.html
Copyright © 2011-2022 走看看