1.  relative(相对定位):生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常(原先本身)位置进行定位。可通过z-index进行层次分级。均是以父级的左上角进行定位,但是父级的Padding属性会对其影响。

2. absolute(绝对定位):生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。可通过z-index进行层次分级。但与relative的区别是其在正常流中的位置不再存在。absolute定位的层总是相对于其最近的定义为absolute或relative的父层,而这个父层并不一定是其直接 父层。如果其父层中都未定义absolute或relative,则其将相对body进行定位

定位属性为absolute的元素定位于其父级元素内,只有满足两个条件: 
  第一:设定TRBL 
  第二:父级设定Position属性 
 

position记录的更多相关文章

  1. position记录元素原始位置

    position记录元素原始位置 css样式: li { width: 100px; height: 100px; margin: 10px 0 0 10px; background-color: # ...

  2. unity position 记录

    localPosition为自身矩形中心点(Pivot)与其父节点矩形中心点(Pivot)的相对位置坐标,与自身锚点(Anchors)无关.anchoredPosition为矩形中心点(Pivot)与 ...

  3. 使用C#处理基于比特流的数据

    使用C#处理基于比特流的数据 0x00 起因 最近需要处理一些基于比特流的数据,计算机处理数据一般都是以byte(8bit)为单位的,使用BinaryReader读取的数据也是如此,即使读取bool型 ...

  4. 设计模式(十):从电影院中认识"迭代器模式"(Iterator Pattern)

    上篇博客我们从醋溜土豆丝与清炒苦瓜中认识了“模板方法模式”,那么在今天这篇博客中我们要从电影院中来认识"迭代器模式"(Iterator Pattern).“迭代器模式”顾名思义就是 ...

  5. mha安装使用手册

    mha安装使用手册 注:目前mha最新的版本代码已经不放到google code网站了,而是放在github上,最新的版本为0.57,github链接如下: mha manager:https://g ...

  6. Java读取文件的几种方式

    package com.mesopotamia.test; import java.io.BufferedReader; import java.io.ByteArrayInputStream; im ...

  7. TreeView使用

    1.添加节点,实现拖拽功能 private void Form1_Load(object sender, EventArgs e) { TreeNode node1 = new TreeNode(); ...

  8. Android九宫格界面实现点击每个格点击跳转界面

    刚开始有个任务就是做一个九宫格界面,后来有个任务就是实现点击每个格并跳转界面实现每个格的功能.下面我就介绍一下我是如何实现该功能的 首先写一下我的想法是: 登录成功后显示一个九宫格界面,每个九宫格的每 ...

  9. Unity 移动端触摸屏操作

    Unity 触屏操作 当将Unity游戏运行到IOS或Android设备上时,桌面系统的鼠标左键可以自动变为手机屏幕上的触屏操作,但如多点触屏等操作却是无法利用鼠标操作进行的.Unity的Input类 ...

随机推荐

  1. JAVA爬虫Nutch、WebCollector的正则约束

    爬虫爬取时,须要约束爬取的范围. 基本全部的爬虫都是通过正則表達式来完毕这个约束. 最简单的,正则: http://www.xinhuanet.com/.* 代表"http://www.xi ...

  2. Linux_Oracle10 下载安装

    Linux_Oracle10 安装文档及oracle下载地址 http://download.csdn.net/detail/u012750578/8177405 一.启动数据库服务 [root@hq ...

  3. Visual Code中的智能提示

    https://code.visualstudio.com/docs/editor/intellisense C# https://marketplace.visualstudio.com/items ...

  4. thinkphp里面的or查询

    thinkphp里面的or查询 whereOr 方法 使用whereOr 方法进行OR 查询: Db::table('think_user') ->where('name','like','%t ...

  5. 概率编程语言(Probabilistic Programming Languages)库 —— edward

    注意:tensorflow api 在 1.1.0 以后迎来重大变化,edward 的稳定版依赖于 tensorflow 1.1.0. edward是一个支持概率建模.推断的 Python 第三方库, ...

  6. RandomStringUtils生成随机数

    org.apache.commons.lang.RandomStringUtils;                                        //产生5位长度的随机字符串,中文环 ...

  7. Weka中数据挖掘与机器学习系列之基本概念(三)

    数据挖掘和机器学习 数据挖掘和机器学习这两项技术的关系非常密切.机器学习方法构成数据挖掘的核心,绝大多数数据挖掘技术都来自机器学习领域,数据挖掘又向机器学习提出新的要求和任务. 数据挖掘就是在数据中寻 ...

  8. android的HTTP框架之Volley

    Volley是android官方开发的一个HTTP框架,简化了利用java中原生的HTTP操作API-HttpURLConnection和HttpClient的操作. 一.首先是Volley的简单使用 ...

  9. 简述SQL with(unlock)与with(readpast)

    所有Select加 With (NoLock)解决阻塞死锁,在查询语句中使用 NOLOCK 和 READPAST 处理一个数据库死锁的异常时候,其中一个建议就是使用 NOLOCK 或者 READPAS ...

  10. React开发实时聊天招聘工具 -第三章 React基础知识回顾

    function a (props) { return <h1>hello world{this.props.asd}</h1> } class a extends React ...