一.定位--position属性
 1.static:默认值 没有定位--以标准文档流方式显示
 2.relative:相对定位--相对自身原来的位置进行偏移(top left right bottom)
 3.absolute:绝对定位
 4.fixed:固定定位

二.相对定位元素的规律
 1.设置相对定位的盒子会相对它原来的位置,通过指定偏移到达新的位置
 2.设置相对定位的盒子仍在标准文档流中,它对父级盒子和相邻盒子都没有影响

三.绝对定位-- absolute属性
 1.偏移位置:left right top bottom
 2.使用了绝对定位的元素以它最近的一个“已经定位”的“祖先元素”为基准进行偏移,
   如果没有已近定位的“祖先元素”那么会以为浏览器为基准进行偏移
 3.绝对定位的元素从标准文档流中脱离,这意味着它们对其他元素的定位不会造成影响
 4.绝对定位不设置偏移量元素将保持原来的位置,但脱离标准文档流

四.调整元素定位重叠层的上下位置
 1.z-infex属性值:整数默认值为0
 2.设置position属性时z-iindex属性可以设置各元素之间的重叠高低关系
 3.z-index值大的层位于其小的层上方

定位--position属性的更多相关文章

  1. 总结一下CSS中的定位 Position 属性

    在CSS中,Position 属性经常会用到,主要是绝对定位和相对定位,简单的使用都没有问题,尤其嵌套起来,就会有些混乱,今记录总结一下,防止久而忘之. CSS position 属性值: absol ...

  2. CSS学习笔记——定位position属性的学习

    今天学习之前剩下的一个问题:CSS的position属性.首先归纳出和position相关的问题: position作为一个属性,它一共有哪几个属性值? position常用的属性值有哪几个?分别有什 ...

  3. [转]总结一下CSS中的定位 Position 属性

    在CSS中,Position 属性经常会用到,主要是绝对定位和相对定位,简单的使用都没有问题,尤其嵌套起来,就会有些混乱,今记录总结一下,防止久而忘之. CSS position 属性值: absol ...

  4. css定位position属性深究

    1.static:对象遵循常规流.此时4个定位偏移属性不会被应用. 2.relative:对象遵循常规流,并且参照自身在常规流中的位置通过top,right,bottom,left这4个定位偏移属性进 ...

  5. 前端定位Position属性四个值

    1.static(静态定位):默认值.没有定位,元素出现在正常的流中. 2.relative(相对定位):生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常(原先本身 ...

  6. [转载]CSS元素的定位position

    CSS元素的定位position 属性position   值 描述 absolute                             生成绝对定位的元素,相对于 static 定位以外的第一 ...

  7. CSS笔记(十)position属性与定位

    参考:http://www.w3school.com.cn/cssref/pr_class_position.asp position属性规定了元素的定位类型.任何元素都可定位,其中,绝对或固定元素会 ...

  8. 总结·CSS3中定位模型之position属性的使用方法

    一.position元素介绍 position属性规定了元素的定位类型,通过定位,可准确地定义元素相对于其正常位置而应该出现的位置,或者是相对于父元素.另一元素和浏览器窗口等的位置. position ...

  9. CSS 定位相关属性 :position

    我们平时经常用margin来进行布局,但是遇到一些盒子不规律布局时,用margin就有点麻烦了,这个时候我们可以用position. position:参数 参数分析: 一.absolute: 相对父 ...

随机推荐

  1. EF的DbSet属性的Where查询,注意事项

    #1 Func<T,bool>与 Expression<Func<T,bool>>的区别 Func<T,bool>本身就是一个委托(delegate), ...

  2. ABAP 7.4 新语法-内嵌生命和内表操作

    1.内嵌声明 2.内表操作 3.opensql ************************************************************************ 1. ...

  3. 【stm32中断优先级--珍藏版】

    看了这么久,一直不理解中断优先级,还有中断嵌套.stm32提供了多种嵌套方式,搞的我真是头昏脑涨. 今天终于看到了一个通俗解释中断优先级的博客.算是理解了一点吧. 原文地址:http://blog.s ...

  4. git的使用及常用命令

    一,GIT是什么? git是目前世界上最先进的分布式版本控制系统 Git是分布式版本控制系统,那么它就没有中央服务器的,每个人的电脑就是一个完整的版本库,这样,工作的时候就不需要联网了,因为版本都是在 ...

  5. MySQL操作(二)MySQL配置文件

    1.正常安装之后,有安装目录,我的直接安装在默认目录下,即 C:\Program Files\MySQL\MySQL Server 5.7 目录下 而数据存储在 C:\ProgramData\MySQ ...

  6. VueJS实现一个货币结算自定义控件

    Vue.component('currency-input', { template: '\ <div>\ <label v-if="label">{{ l ...

  7. springcloud(一):大话Spring Cloud

    研究了一段时间spring boot了准备向spirng cloud进发,公司架构和项目也全面拥抱了Spring Cloud.在使用了一段时间后发现Spring Cloud从技术架构上降低了对大型系统 ...

  8. Charles抓取https请求详解

    大家好,我是TT,互联网测试行业多年,没有牛逼的背景,也没有什么可炫耀的,唯独比他人更努力,在职场打拼.遇到过的坑,走过的弯路,愿意与大家分享,分享自己的经验,少走弯路.首发于个人公众号[测试架构师] ...

  9. iOS刨根问底-深入理解RunLoop

    开源的RunloopRef 通常所说的RunLoop指的是NSRunloop或者CFRunloopRef,CFRunloopRef是纯C的函数,而NSRunloop仅仅是CFRunloopRef的OC ...

  10. IOS中的通知NSNotification

    类似于Android中的广播接收者发送者 1.一般完整的通知包含三个属性 -(NSString *)name ;//通知的名称 -(id)object ;//通知发布者(是谁要发布通知) -(NSDi ...