static(静态定位):即默认值,元素框正常生成的,top、right、bottom、left这些偏移属性不会影响静态定位的正常显示(属性不应用);

relative(相对定位):元素相对自身偏移某个位置,元素仍保持其未定位前的形状,它原本所占的空间仍保留,可通过z-index进行层次分级,子元素可相对该元素进行绝对定位;

absolute(绝对定位):元素框从文档流完全删除,相对于其最近的父级块元素(如果父级 position 为 static 时,absolute元素将以body坐标原点进行定位),元素原先在正常文档流中所占的空间会关闭,就好像元素原来不存在一样。元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框,可通过z-index进行层次分级;

fixed(固定定位):它所相对固定的对象是可视窗口,与其他无关,可通过z-index进行层次分级。

CSS定位有几种?分别描述其不同的更多相关文章

  1. CSS定位的三种机制:普通流、绝对定位和浮动

    1.普通流: position : static – 元素框正常生成.即上述不对元素进行任何样式设置的默认形态. position : relative (此时设置top, right, bottom ...

  2. CSS定位:几种类型的position定位的元素

    当人们刚接触布局的时候都比较倾向于使用定位的方式.因为定位的概念看起来好像比较容易掌握.表面上你确切地指定了一个块元素所处的位置那么它就会坐落于那里.可是定位比你刚看到的时候要稍微复杂一点.对于定位来 ...

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

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

  4. css中的三种基本定位机制

    css中的三种基本定位机制 a.普通文档流 b.定位:相对定位 绝对定位 固定定位 c.浮动 1.普通流中,元素位置由文档顺序和元素性质决定,块级元素从上到下依次排列,框之间的垂直距离由框的垂直mar ...

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

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

  6. css定位方式有哪几种?

    复杂的网页布局都是通过各种网页元素灵活定位实现的,网页中的各种元素定位都有自己的特点.下面我们来看一下css的几种定位方式. float定位(即浮动定位): 这种定位方式很简单,只需规定一个浮动的方向 ...

  7. 练习题 --- 写出5种css定位语法

    写出至少5种css语法(每种语法不一样)

  8. css定位和浮动

    1.css中一切元素皆为框.div.p.h1等为块框:span.strong等为行内框,(在文本中每一行会被自动默认为行框,行框和行内框是不一样的概念).通过display可以改变框的类型,行内框通过 ...

  9. CSS定位(CSS定位概述、相对定位、绝对定位、浮动)

    CSS 定位属性 CSS 定位属性允许你对元素进行定位. 属性 描述 position 把元素放置到一个静态的.相对的.绝对的.或固定的位置中. top 定义了一个定位元素的上外边距边界与其包含块上边 ...

随机推荐

  1. 使用fiddl模拟弱网

    原文地址:https://www.jianshu.com/p/71c3b4a49930 Fiddler-弱网设置 1.打开fiddler,点击 Rules->Performance-> 勾 ...

  2. 树莓派上跑.NET的segment fault错误

    答案:树莓派1和树莓派zero是不支持的,原因是.net需要arm v7 详情看这里 可以用 cat /proc/cpuinfo | grep 'model name' |uniq 看一下cpu

  3. web框架解析

    一.白手起家 要想模拟出web请求响应的流程,先想想平时我们是怎么上网浏览网页的?首先打开浏览器,然后在地址栏中输入我们想要访问的页面,紧接着按下回车键Enter,最后跳转至目标页面(当然我们也会出现 ...

  4. 03 python 对象笔记

    类的命名方法 1.使用大驼峰命名法:每一个单词的首字母大写(第一个的也要)2.单词之间不需要下划线 对象的内置函数和属性 1.使用dir()函数来获取对象的内置方法和属性.返回值是一个列表.2.返回中 ...

  5. PAT甲级题分类汇编——线性

    本文为PAT甲级分类汇编系列文章. 线性类,指线性时间复杂度可以完成的题.在1051到1100中,有7道: 题号 标题 分数 大意 时间 1054 The Dominant Color 20 寻找出现 ...

  6. 简单理解JavaScript原型链

    简单理解原型链 什么是原型 ? 我是这样理解的:每一个JavaScript对象在创建的时候就会与之关联另外一个特殊的对象,这个对象就是我们常说的原型对象,每一个对象都会从原型"继承" ...

  7. 【转载】Sqlserver使用Right函数从最右边向前截取固定长度字符串

    在SQL语句查询过程中,Sqlserver支持使用LEFT().RIGHT().SUBSTRING()等几个函数对字符串进行截取操作,其中Left函数表示从开始字符向后截取多少个字符,Right函数表 ...

  8. 【转载】 C#中日期类型DateTime的日期加减操作

    在C#开发过程中,DateTime数据类型用于表示日期类型,可以通过DateTime.Now获取当前服务器时间,同时日期也可以像数字一样进行加减操作,如AddDay方法可以对日期进行加减几天的操作,A ...

  9. 【转】SpringCloud学习笔记(一)——基础

    什么是微服务架构 简单地说,微服务是系统架构上的一种设计风格,它的主旨是将一个原本独立的系统拆分成多个小型服务,这些小型服务都在各自独立的进程中运行,服务之间通过基于HTTP的RESTful API进 ...

  10. c#的异步处理思路和vue前端中异步处理思路比较

    前语:目前工作在做的项目是前端基于vue的组件式开发,通过api接口调用,后端数据逻辑是一个c#实现的WCF服务 1.总结自己在c# .NET 4.5后的新异步方式  async搭配await来实现  ...