css中的三种基本定位机制

  a.普通文档流

  b.定位:相对定位

      绝对定位

      固定定位

  c.浮动

1.普通流中,元素位置由文档顺序和元素性质决定,块级元素从上到下依次排列,框之间的垂直距离由框的垂直margin值计算得到,行内元素在一行中水平布置

2.相对定位看作普通流的一部分,移动后的元素仍占据原来的位置,移动元素会导致他覆盖其他的框

3.绝对定位相对于已定位的最近的祖先元素,绝对定位脱离普通流

4.固定定位是相对于浏览器窗口的定位

5.浮动的元素可以左右移动,直到他的外边框边缘碰到包含自己的框或者另一个浮动框的边缘

6.浮动的元素脱离普通文档流

7.行内元素和行内块元素会围绕浮动框排列,块元素会被覆盖

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

  1. CSS中的三种基本的定位机制(普通流、定位、浮动)

    一.普通流 普通流中元素框的位置由元素在XHTML中的位置决定.块级元素从上到下依次排列,框之间的垂直距离由框的垂直margin计算得到.行内元素在一行中水平布置. 普通流就是html文档中的元素如块 ...

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

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

  3. 《转载》CSS中的三种样式来源:创作人员、读者和用户代理

    CSS中的样式一共有三种来源:创作人员.读者和用户代理,来源的不同会影响到样式的层叠方式,很多第一次学习CSS的朋友,对这三种来源可能会存在一些困惑,下面我写一下自己的理解,若有错误的地方还请指正. ...

  4. ucos中的三种临界区管理机制

    熟悉ucos,或者读过Jean.J.Labrosse写过的ucos书籍的人,一定会知道ucos中著名的临界区管理宏:OS_ENTER_CRITICAL()和OS_EXIT_CRITICAL(). 同样 ...

  5. 理解CSS中的三种选择器>+~

    1. p~ul p和ul有相同的父元素,选择出p元素之后的所有ul元素,其中,p和ul不一定是紧随,但是必须有相同的父元素 E+F            相邻兄弟选择器.选择匹配F的元素,且该元素位于 ...

  6. Java三大框架之——Hibernate中的三种数据持久状态和缓存机制

    Hibernate中的三种状态   瞬时状态:刚创建的对象还没有被Session持久化.缓存中不存在这个对象的数据并且数据库中没有这个对象对应的数据为瞬时状态这个时候是没有OID. 持久状态:对象经过 ...

  7. python 中增加css样式的三种方式

    增加css样式的三种方式: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  8. 前端js,css文件合并三种方式,bat命令

    前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...

  9. Asp.Net中的三种分页方式

    Asp.Net中的三种分页方式 通常分页有3种方法,分别是asp.net自带的数据显示空间如GridView等自带的分页,第三方分页控件如aspnetpager,存储过程分页等. 第一种:使用Grid ...

随机推荐

  1. JDK 9 & JDK 10 新特性

    JDK 9 新增了不少特性,官方文档:https://docs.oracle.com/javase/9/whatsnew/toc.htm#JSNEW-GUID-527735CF-44E1-4144-9 ...

  2. Appium Hybrid混合应用测试——Native切换WebView , 切换不了WebView (没有试过,先记录在此)

    Appium Hybrid混合应用测试过程中,经常需要在Native和WebView之间进行切换: 1.切换至WEBVIEW操作: for cons in driver.contexts: if co ...

  3. 20181122_C#中AOP初探_装饰器模式的AOP_Remoting实现AOP_Castle实现AOP

    一.   什么是AOP: a)         AOP是面向切面编程; 就像oop一样, 它也是一种编程思想; i.    Oop思想→一切皆对象, 对象交互组成功能, 功能叠加组成模块, 模块叠加组 ...

  4. 2017百度之星初赛A-1006(HDU-6113)

    思路:在图的外面包一圈'0'字符,然后dfs统计'0'字符的个数和'1'字符的个数.结果如下(num0表示0字符的个数,num1表示1字符的个数): num0 == 1 && num1 ...

  5. C 语言 - 分支、跳转和循环语句

    if 条件判断语句 if 语句结构 格式: if (表达式) { 语句; } 如果表达式成立,就执行大括号中的语句:否则跳过该 if 语句 #include <stdio.h> int m ...

  6. Linux的bond模式绑定及模式区别

    [Linux的bond模式配置] 原理: 多块网卡虚拟成一张,实现冗余:多张网卡对外显示一张,具有同一个IP: 工作在网卡是混杂模式的情况下: 对于多物理网卡的 Bond 网卡而言,其中一块物理网卡会 ...

  7. nova volume-create的使用

    处理cinder可以直接创建volume外,nova也是可以的 如: 可以看出创建一个名字为volume2的卷,大小为10G 把创建好的volume2卷直接挂在vm虚拟机上 如:先查看计算节点有几个v ...

  8. processlist中最哪些状态要引起关注

    一般而言,我们在processlist结果中如果经常能看到某些SQL的话,至少可以说明这些SQL的频率很高,通常需要对这些SQL进行进一步优化. 今天我们要说的是,在processlist中,看到哪些 ...

  9. Latex编译后Yap查看报错Not all fonts could be loaded

    在用Latex写中文大论文时,编译后,用Yap查看DVI文件,打开时,Yap报错: "Not all fonts could be loaded. See 'File->Documen ...

  10. 论XGBOOST科学调参

    XGBOOST的威力不用赘述,反正我是离不开它了. 具体XGBOOST的原理可以参见之前的文章<比XGBOOST更快--LightGBM介绍> 今天说下如何调参. bias-varianc ...