position属性的总结
| static | 默认。位置设置为 static 的元素,它始终会处于页面流给予的位置(static 元素会忽略任何 top、bottom、left 或 right 声明)。 |
| relative | 位置被设置为 relative 的元素,可将其移至相对于其正常位置的地方,因此 "left:20" 会将元素移至元素正常位置左边 20 个像素的位置。relative定位的层总是相对于其最近的父元素,无论其父元素是何种定位方式。 |
| absolute | 位置设置为 absolute 的元素,可定位于相对于包含它的元素的指定坐标。此元素的位置可通过 "left"、"top"、"right" 以及 "bottom" 属性来规定。absolute定位的层总是相对于其最近的定义为absolute或relative的父层,而这个父层并不一定是其直接 父层。如果其父层中都未定义absolute或relative,则其将相对body进行定位 |
| fixed | 位置被设置为 fixed 的元素,可定位于相对于浏览器窗口的指定坐标。此元素的位置可通过 "left"、"top"、"right" 以及"bottom" 属性来规定。不论窗口滚动与否,元素都会留在那个位置。工作于 IE7(strict 模式)。以视口为基准 |
position属性的总结的更多相关文章
- 总结一下CSS中的定位 Position 属性
在CSS中,Position 属性经常会用到,主要是绝对定位和相对定位,简单的使用都没有问题,尤其嵌套起来,就会有些混乱,今记录总结一下,防止久而忘之. CSS position 属性值: absol ...
- Position属性四个值:static、fixed、absolute和relative的区别和用法
Position属性四个值:static.fixed.absolute和relative的区别和用法 在用CSS+DIV进行布局的时候,一直对position的四个属性值relative,absolu ...
- 由position属性引申的关于css的进阶讨论(包含块、BFC、margin collapse)
写这篇文章的起因是源于这篇文章:谈谈面试与面试题 中关于position的讨论,文中一开始就说的这句话: 面试的时候问个css的position属性能刷掉一半的人这是啥情况…… 其实这问题我本来打算的 ...
- Css中的Position属性
Css中的Position属性 Css属性在线查询地址: http://www.css88.com/book/css/properties/index.htm CSS 中的 position 属性 在 ...
- DIV的Position属性和DIV嵌套DIV
1.前言 我们在利用div+css进行布局时,常常被div的位置弄的焦头烂额,很多人甚至放弃了div而直接用table.这里一如既往的推荐使用div布局,其实我们只要掌握了div的position属性 ...
- position属性的四个value
As we all know, position属性有四个值,分别为 relative,fixed,absolute, static. 1,relative相对定位 (不会脱离文档流) 在一个相对定位 ...
- 几种Position属性的用法
几种Position常见的属性就是一下几种: 1.static:默认值.没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明). 2.re ...
- css中关于position属性的探究(原创)
关于position属性的设置,头脑中一直觉得不是很清楚,所以借助这次机会单独自己测试了一下,记作学习笔记. 首先,css的position属性包含下面四种设置情况: static:默认属性.指定 ...
- 详解css中的position属性
这一次直接进入主题. css中最常用的布局类属性,一个是float,另一个就是定位属性position. 对于position来讲,有以下属性值: static : 无特殊定位,对象处于正常文档流.其 ...
- position属性absolute与relative 详解
最近一直在研究javascript脚本,熟悉DOM中CSS样式的各种定位属性,以前对这个属性不太了解,从网上找到两篇文章感觉讲得很透彻,收藏下来,唯恐忘记.一.解读absolute与relative ...
随机推荐
- Python实现机器学习算法:AdaBoost算法
Python程序 ''' 数据集:Mnist 训练集数量:60000(实际使用:10000) 测试集数量:10000(实际使用:1000) 层数:40 ------------------------ ...
- 案例1:写一个压缩字符串的方法,例如aaaabbcxxx,则输出a4b2c1x3。
public static String zipString(String str){ String result = "";//用于拼接新串的变量 char last = str ...
- .Net Core 全球化&本地化的使用
官网文档 nuget地址 创建资源文件 添加资源文件 实施策略 配置本地化 本地化中间件 使用 视图本地化 DataAnnotations 本地化 Make the app's content loc ...
- Kubernetes工作流之Pods二
Init Containers This feature has exited beta in 1.6. Init Containers can be specified in the PodSpec ...
- ISTQB学习笔记
学习ISTQB大纲此文记录初次阅读时不够明确的地方 第一章:软件测试基础1. 引起软件缺陷的原因人都会犯错误(error,mistake),因此人设计的代码或文档中会引入缺陷(defect, faul ...
- HDU 1241 Oil Deposits(石油储藏)
HDU 1241 Oil Deposits(石油储藏) 00 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Probl ...
- BZOJ 1497: [NOI2006]最大获利(最大权闭合图)
http://www.lydsy.com/JudgeOnline/problem.php?id=1497 题意: 思路: 论文题,只要看过论文的话就是小菜一碟啦~ 每个用户群i作为一个结点分别向相应的 ...
- Redux基础使用
Redux基础使用: 简介:这里是从需求来响应的执行操作redux,所以理解起来更加的容易铭记在心的三点:action/reducer/store 除此之外就是react/react native的基 ...
- 基于 Python 和 Pandas 的数据分析(2) --- Pandas 基础
在这个用 Python 和 Pandas 实现数据分析的教程中, 我们将明确一些 Pandas 基础知识. 加载到 Pandas Dataframe 的数据形式可以很多, 但是通常需要能形成行和列的数 ...
- 【BZOJ】3573: [Hnoi2014]米特运输
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3573 屁话一堆,就是说: 1.一棵树中的每个点的每个儿子的权值之和要等于这个点的权值 2. ...