分为三种:普通流、浮动、绝对定位

普通流:默认,html文档的排列顺序块级从上到下(垂直距离由margin-top、margin-bottom决定);行内元素在一行中从左到右(由margin-left/right、padding-left/right调整水平距离) PS:相对定位属于其一部分

浮动:float元素存在占位,并未完全脱离文档流(普通流),脱离了父元素

绝对定位:彻底脱离普通流,所以它可以覆盖页面上的其他元素,可以通过设置Z-Iindex属性来控制这些框的堆放次序。

float和absolute的区别:

1.absolute元素是可以通过top/bottom/left/right调整自己的位置,而float元素受其他元素的影响,通过其他元素确定自身的位置

2.float元素之间在占位上是相互影响的,而absolute元素即使处于同一层,在占位上是互不影响的(absolute同级会覆盖;float会平行排列)

css的基本定位机制的更多相关文章

  1. CSS中的定位机制

    CSS3 中有三种定位机制 : 普通文档流 (text)| 浮动(float) | 定位(position) 普通文档流 就是CSS中默认的文本文档 普通流中,元素位置由文档顺序和元素性质决定,块级元 ...

  2. CSS三种定位机制

    标准文档流 块级元素撑满整个页面div,ul,li,dl,dt,p 行级元素可以一行显示多个span,strong,img,input大部分 一般不设置盒子的高度,另其自动调整 margin属性的au ...

  3. 1.CSS中的定位机制

    标准文档流(Normal flow) 特点: 从上到下,从左到右,输出文档内容 由块级元素和行级元素组成 块级元素: 从左到右撑满页面,独占一行 触碰到页面边缘时,会自动换行 块级标签: div.ul ...

  4. CSS中定位机制的想法

    对于一个刚刚接触css的新手而言,CSS的定位机制可能是最让人头疼的一件事情了, 接下来我们了解一下CSS的定位机制. position:static | relative | absolute | ...

  5. CSS有三种基本的定位机制

    CSS有三种基本的定位机制:普通流,浮动和绝对定位. 普通流:在普通流中元素框的位置由元素在html中的位置决定, 1.元素position属性为static或继承来的static时就会按照普通流定位 ...

  6. CSS中的三种基本的定位机制

    CSS 定位机制 CSS 有三种基本的定位机制:普通流.浮动和绝对定位. 一.普通流 除非专门指定,否则所有框都在普通流中定位.普通流中元素框的位置由元素在(X)HTML中的位置决定.块级元素从上到下 ...

  7. CSS定位机制

    CSS中,存在3种定位机制:标准文档流(Normal flow) * 特点:从上到下,从左导游,输出文档内容 * 由块级元素和行级元素组成 浮动(Floats) * 能够实现横向多列布局 * 设置了浮 ...

  8. css的定位机制

    牛腩新闻发不系统中遇到了CSS(Cascading style sheets),第一次接触,比较陌生还!因为CSS很多关于元素定位的问题,并且很多情况下元素的位置以像素精度计.一个不小心就很头疼,为此 ...

  9. 【css笔记】css中的盒模型和三种定位机制(固定定位,绝对定位,浮动)

    html页面上的元素都可以看成是框组成的,框通过三种定位机制排列在一起就过程了我们看到的页面.而框就是盒模型. 盒模型 1.页面上的每个元素可以看成一个矩形框,每个框由元素的内容,内边距,边框和外边距 ...

随机推荐

  1. Unity3D用户手册

    Unity Manual 用户手册 Welcome to Unity. 欢迎使用Unity. Unity is made to empower users to create the best int ...

  2. bzoj 1002

    表示我这种蒟蒻面对这种递推第一思想显然是打表啊 先贴个用来打表的暴力: #include <cstdio> struct node {     int l,r; }p[]; ]; ]; i ...

  3. mybatis初始化过程

    mybatis初始化如下: //加载配置文件InputStream resourceAsStream = Resources.getResourceAsStream("testMybatis ...

  4. JAVA 程序编译过程;编辑器,编译器和解释器

    最基本的软件工具包括,编辑器,编译器,解释器; 编译器:编译器就是将一种编程语言代码翻译成另一种语言的等效代码程序. 解释器:解释器将编译和执行交织在一起,即编译一部分代码后执行该部分代码,然后再编译 ...

  5. 虚拟机下安装Centos7并配置Apache+PHP+Mysql+phpmyadmin+wordpress

    一.安装Apache yum install httpd 安装成功后,Apache操作命令: systemctl start httpd //启动apache systemctl stop httpd ...

  6. openmp查看最大线程数量

    CMakeLists.txt cmake_minimum_required(VERSION 2.8) project(omp_test) find_package(OpenMP REQUIRED) i ...

  7. EF Fluent API

    EntityTypeConfiguration 它可以为一个实体类,配置一个模型. Entity Framework 6 一次加载许多个 Fluent API 映射 如果对于许多实体有大量映射,则 O ...

  8. springboot logback 相关使用

    参考: https://www.cnblogs.com/EasonJim/p/9159195.html https://blog.csdn.net/tianyaleixiaowu/article/de ...

  9. web应用启动后发现被自动访问

    为了找到原因,做了以下操作,发现是eclipse访问的,但是具体原因未知

  10. [转] css3变形属性transform

    w3c上的例子是这样子写的:· div { transform:rotate(7deg); -ms-transform:rotate(7deg); /* IE 9 */ -moz-transform: ...