绝对对位 position：absolute;
当一个元素设定了绝对对位，
如果他的父元素有设置定位（不管是绝对还是相对定位），那么他的坐标就是相当于父元素的左上角 进行定位（即 left:1px;top:2px;等都是相对于父元素的偏移）
如果他的父元素没有设置定位，那么他就向上找他的爷爷辈来进行偏移..

相对对位： position：relative;
当一个元素设定了相对对位，
他的坐标就是相当他原来的位置 进行的定位（即 left:1px;top:2px;等都是相对于他原来的位置的左上角的偏移）

HTML --- 盒模型的更多相关文章

  1. css_02之盒模型、渐变

    1.框模型:盒模型,①对象实际宽度=左右外边距+左右边框+左右内边距 + width:②对象实际高度=上下外边距+上下边框+上下内边距 + height: 2.外边距:margin:取值:①top(上 ...

  2. css3盒模型

    css2.1盒模型: 当你定义盒子的宽高后:如果添加padding和border值后盒子的宽高会被撑大 盒子的高度=定义的高度+(padding-top + padding-bottom)+(bord ...

  3. 前端开发：css基础知识之盒模型以及浮动布局。

    前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把 ...

  4. css之盒模型

    盒模型由内容(content).填充(padding).边框(border).边界(margin)组成,一个盒子中主要的属性就5个:width.height.padding.border.margin ...

  5. 精通css 高级web标准解决方案——可视化格式模型-盒模型

    1-盒模型的两种标准: IE :width 和 height属性 是包括padding和border在内的. w3c:width 和 height 属性,就是单纯的内容的宽高,padding 是内容之 ...

  6. （转）详解css3弹性盒模型（Flexbox)

    今天刚学了css3的弹性盒模型,这是一个可以让你告别浮动.完美实现垂直水平居中的新特性. Flexbox是布局模块,而不是一个简单的属性,它包含父元素和子元素的属性. Flexbox布局的主体思想是似 ...

  7. padding标准盒模型和怪异盒子模型

    我们都知道padding是为块级元素设置内边距 但是在使用过程中,我们却会遇到一些问题.padding的标准盒模型和怪异盒模型 padding盒子模型 我们通过demo来讲这个问题,用文字干讲第一没意 ...

  8. CSS3盒模型display:box;box-flex:3;

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

  9. 了解HTML 盒模型

    HTML在布局上, 有一个非常重要的模型, 那就是盒子模型, 在盒子模型中把标签内容理解为一个物品, 而css样式理解为包容着这个物品的盒子, 一般的块级标签都具有盒子模型的特征, 你可以在css中对 ...

  10. css3弹性盒模型

    一.简介 css3引入了新的盒模型——弹性盒模型,该模型决定一个盒子在其他盒子中的分布方式以及如何处理可用的空间.使用该模型,可以很轻松的创建自适应浏览器窗口的流动布局或自适应字体大小的弹性布局. 目 ...

随机推荐

  1. POJ_1088 滑雪(记忆型DP+DFS)

    Description Michael喜欢滑雪,这并不奇怪, 因为滑雪的确很刺激.可是为了获得速度,滑的区域必须向下倾斜,而且当你滑到坡底,你不得不再次走上坡或者等待升降机来载你.Michael想知道 ...

  2. [jQuery] Cannot read property ‘msie’ of undefined错误的解决方法

    最近把一个项目的jQuery升级到最新版,发现有些页面报错Cannot read property ‘msie’ of undefined.上jQuery网站上搜了一下,原因是$.browser这个a ...

  3. iOS 从C移植项目到Objective-C

    一.新建项目 iOS | Framework & Library Cocoa Touch Static Library 新建一个Library库 1. M.h头文件 #ifndef M_h # ...

  4. 【转】oracle数据库NUMBER数据类型

    原文:http://www.jb51.net/article/37633.htm NUMBER ( precision, scale)a)  precision表示数字中的有效位;如果没有指定prec ...

  5. Forward reference vs. forward declaration

    Q:Im a bit confused. What is the difference between forward declaration and forward reference? Forwa ...

  6. 从文章"避免复制与粘贴"到文章"Extract Method"的反思(1)

    看了一个比我牛的人的博客园的博文"避免复制和粘贴".里面提到了重构手法Extract Method.  所以又搜了一下Extract Method. 这里先自我理解Extract ...

  7. 源码编译基于Android平台的XBMC笔记

    参考官方网站:https://github.com/xbmc/xbmc/blob/master/docs/README.android   1. 编译主机系统 Ubuntu (12.04) 64Bit ...

  8. Sharepoint 问题集锦 - 外部列表(external list) - 读取当前用户上下文或用户名作为筛选参数

    在创建外部列表过程中,往往需要添加筛选参数,而较多开发用户,会关心如何在外部列表中,只显示当前用户相关的行.本例子中,我们以任务数据表来做例子,看看如何实现这个需求. 1)数据表tbl_task: t ...

  9. 【转】改善C#程序的建议2：C#中dynamic的正确用法 空间

    dynamic是FrameWork4.0的新特性.dynamic的出现让C#具有了弱语言类型的特性.编译器在编译的时候不再对类型进行检查,编译期默认dynamic对象支持你想要的任何特性.比如,即使你 ...

  10. EF自动生成的（T4模板） 关联属性元数据修改

    为了实现 T4模板关联属性 不要序列化的问题 就是要在具体的 关联属性上面添加一个元数据 这里利用以前的 Newtonsoft.Json 这个框架为例 效果应该为 就是要在关联属性上面添加元数据  [ ...