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

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

浮动：float元素存在占位，并未完全脱离文档流（普通流），脱离了父元素

绝对定位：彻底脱离普通流，所以它可以覆盖页面上的其他元素，可以通过设置Ｚ-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. 步步为营-74-Request,Response和server的其他成员

    Request 1 Request.UrlReferrer 获取请求的来源 2 Request.UserHostAddress 获取访问者的IP地址 3 Request.Cookies 获取浏览器发送 ...

  2. IDEA项目找不到浏览器报错的情况

    调tomcat的时候,它会调用浏览器,浏览器关联如果有问题,肯定是会报错的  要是测试的时候,就是浏览器的问题,重新把浏览器装一遍让他自己重新关联一下应该就行了

  3. Apache Kafka 概述

    kafka教程,完全参照w3school: https://www.w3cschool.cn/apache_kafka/apache_kafka-dac11yot.html 以下是入门学习过程中摘录的 ...

  4. TypeScipt学习

    TypeScript具有类型系统,且是JavaScript的超集.它可以编译成普通的JavaScript代码. TypeScript支持任意浏览器,任意环境,任意系统并且是开源的.Ts主要用于解决那些 ...

  5. Git 分支 - 分支的新建与合并

    转载自:https://git-scm.com/book/zh/v1/Git-%E5%88%86%E6%94%AF-%E5%88%86%E6%94%AF%E7%9A%84%E6%96%B0%E5%BB ...

  6. MySQL基础一（CMD使用）

    概述 MySQL因可移植行高,安装简单小巧等优点被更多的开发者喜爱.执行MySQL的指令的方式有2种方式,方式一.MySQL的客户端软件比如navicat :方式二.通过Cmd命令: CMD命令执行方 ...

  7. bzoj2683&&bzoj4066

    题解: 前一题不是强制在线,后一题是强制在线 树套树空间会炸 说一下cdq分治+树状数组 首先我们利用cdq分治使得查询和操作保证先后关系 然后矩阵查询变成4个矩阵的差 那么我们就可以运用扫描线的方法 ...

  8. Python的_文件操作

    打开文件:file_obj=open("文件路径","模式",“编码”’) 其中模式有: r,以只读方式打开文件(默认) w,打开一个文件只用于写入(不存在则创 ...

  9. LBS基站定位

    LBS基站定位(Location Based Service,简称LBS)一般应用于手机用户,它是基于位置的服务,通过电信.移动运营商的无线电通讯网络(如GSM网.CDMA网)或外部定位方式(如GPS ...

  10. Linux 常用基本指令

    1.ls 参数: -a:列出所有目录(“.”开头的是隐藏文件) -l: 以长格式列出目录下的内容列表 2.cd cd  切换到家目录 cd ~ 切换到家目录 cd .. 切换到上一级目录 3.pwd ...