zoukankan      html  css  js  c++  java
  • 定位

    1、定位 : 将元素固定到指定的位置上,包括定位模式和边偏移

    定位模式:静态定位   相对定位、绝对定位、固定定位
    边偏移:顶、左、右、底(top,left,right,bottom)
     
    (1)相对定位: 相对于元素本身位置  position:  relative; top: 30px; left:100px;
      1. 定义:相对于元素本身的位置
      2. 特点:不脱离标准流(占位置),可脱离父元素
     (2)绝对定位:position:  absolute; top: 30px; left:100px;
      1、如果父元素没有定位,就是相对于视口 viewport
      2、如果父元素有相对定位,就是相对于父元素定位,可脱离父元素的范围
       特征: 脱离标准流,不占位置固定定位

    (3)固定定位:相对于浏览器窗口  position: fiexd

       特征: 脱标、不占位

      添加定位后的元素自动转化为行内块状元素

    (4)静态定位:  position: static

      1、就是网页中所有元素都默认的是静态定位哦! 其实就是标准流的特性。

      2、在静态定位状态下,无法通过边偏移属性(top、bottom、left或right)来改变元素的位置。

    2、区别

     
    定位模式
    是否脱标占有位置
    是否可以使用边偏移
    移动位置基准
    静态static
    不脱标,正常模式
    不可以
    正常模式
    相对定位relative
    不脱标,占有位置
    可以
    相对自身位置移动(自恋型)
    绝对定位absolute
    完全脱标,不占有位置
    可以
    相对于定位父级移动位置(拼爹型)
    固定定位fixed
    完全脱标,不占有位置
    可以
    相对于浏览器移动位置(认死理型)
  • 相关阅读:
    (最小路径覆盖) poj 1422
    (匈牙利算法) hdu 2119
    (匈牙利算法) hdu 4185
    (匈牙利算法) hdu 2063
    (匈牙利算法)hdu 1281
    (匈牙利算法DFS)hdu 3729
    (01 染色判奇环) hdu 3478
    (多重背包)poj 1276
    (判断欧拉回路)poj 1368
    (差分约束) hdu 1384
  • 原文地址:https://www.cnblogs.com/guirong/p/13514295.html
Copyright © 2011-2022 走看看