一、position语法与结构

position语法: position : static absolute relative

position参数:
static :  无特殊定位,对象遵循HTML定位规则
absolute :  将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位。而其层叠通过css z-index属性定义。此时对象不具有边距,但仍有补白和边框
relative :  对象不可层叠,但将依据left,right,top,bottom等属性在正常文档流中偏移位置

二、绝对定位使用条件

position:absoluteposition:relative绝对定位使用通常是父级定义position:relative定位,子级定义position:absolute绝对定位属性,并且子级使用left或right和top或bottom进行绝对定位。

三、css绝对定位总结

绝对定位如果父级不使用position:relative,而直接使用position:absolute绝对定位,这个时候将会以body标签为父级,使用position:absolute定义对象无论位于DIV多少层结构,都将会被拖出以<body>为父级(参考级)进行绝对定位。

在绝对定位时候我们可以使用css z-index定义css层重叠顺序。

css中的position(定位)的更多相关文章

  1. 关于css中的position定位

    希望这波position可以有帮助^_^! css中的position属性主要分为:static.relative.absolute.fixed.center.page.sticky(红色是css3中 ...

  2. 笔记:css中的position定位

    position的值可以是:static,relative,absolute,fixed. 默认值是 static.设置 left.top值无效. relative是相对定位,可以设置left.top ...

  3. css中对position的几种定位方式的最佳诠释

    关于元素的position定位的理解,牛客网的hardy给出了一个比较好的理解: 在html中网页可以看成一个立体的空间,一个完整的页面是由很多个页面堆积形成的,如上图所示   CSS中Positio ...

  4. 对CSS中的Position、Float属性的一些深入探讨

    对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个CSS属性,对于这两个属性的使用上面可能大多数人存在一些模糊与不 ...

  5. Css中的Position属性

    Css中的Position属性 Css属性在线查询地址: http://www.css88.com/book/css/properties/index.htm CSS 中的 position 属性 在 ...

  6. 装载:对CSS中的Position、Float属性的一些深入探讨

    对CSS中的Position.Float属性的一些深入探讨   对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个 ...

  7. 理解css中的position属性

    理解css中的position 两种类型的定位 static类型:只有一个值position: static.position默认值 relative类型:包括三个值,这三个值会相互影响,允许你以特定 ...

  8. CSS position 属性_css中常用position定位属性介绍

    css可以通过为元素设置一个position属性值,从而达到将不同的元素显示在不同的位置, position定位是指定位置的定位,以下为常用的几种: 1.static(静态定位): 这个是元素的默认定 ...

  9. 详解css中的position属性

    这一次直接进入主题. css中最常用的布局类属性,一个是float,另一个就是定位属性position. 对于position来讲,有以下属性值: static : 无特殊定位,对象处于正常文档流.其 ...

  10. css 中的position z-index em rem zoom 的基本用法

    1.position定位: CSS 定位和浮动 CSS 为定位和浮动提供了一些属性,利用这些属性,可以建立列式布局,将布局的一部分与另一部分重叠,还可以完成多年来通常需要使用多个表格才能完成的任务. ...

随机推荐

  1. Spring Boot 快速入门笔记

    Spirng boot笔记 简介 Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的初始搭建以及开发过程.该框架使用了特定的方式来进行配置,从而使开发 ...

  2. Python_网页爬虫

    import sys import multiprocessing import re import os import urllib.request as lib def craw_links( u ...

  3. 微软project文件mpp解析

    最近在做一个项目管理的项目,主要是将用户在project文件中写的一些东西,读出来,并将其写入到数据库中. 也是借鉴了好多大佬的思想和代码,感觉自己需要整理一遍,所以,接下来就是表演的时候了. 第一步 ...

  4. PAT1019:General Palindromic Number

    1019. General Palindromic Number (20) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN ...

  5. win7 中如何设置eclipse的背景色--Console

    http://blog.csdn.net/u013161399/article/details/47297781

  6. [ SSH框架 ] Spring框架学习之二(Bean的管理和AOP思想)

    一.Spring的Bean管理(注解方式) 1.1 什么是注解 要使用注解方式实现Spring的Bean管理,首先要明白什么是注解.通俗地讲,注解就是代码里的特殊标记,使用注解可以完成相应功能. 注解 ...

  7. SDKManager连不上墙外的网,列表刷新不出来怎么办?

    现在我们都无法正常访问外国的网站了,尤其是Google,这个也没了,问题出不去,好多东西都解决的不是很好,包括SDKManager这个都无法刷新列表,当然在这里,我没有介绍你使用VPN的使用,这样做就 ...

  8. maven使用与技巧

    1.Pom文件介绍与基本组成 说明:全称是Project Object Model,通俗点的话说就是要对构建的项目进行建模. 组成的基本元素: 元素 描述 modelVersion 超级pom版本 g ...

  9. Android/Linux Thermal Governor之IPA分析与使用

    IPA(Intelligent Power Allocator)模型的核心是利用PID控制器,Thermal Zone的温度作为输入,可分配功耗值作为输出,调节Allocator的频率和电压值. 由P ...

  10. sql server 阻塞查询

    在生产环境下,有时公司客服反映网页半天打不到,除了在浏览器按F12的Network响应来排查,确定web服务器无故障后.就需要检查数据库是否有出现阻塞 当时数据库的生产环境中主表数据量超过2000w, ...