CSS之定位和堆叠属性

栏目: CSS · 发布时间: 6年前

内容简介:定位有:属性:position属性值:absolute属性:position属性值:relative

CSS之定位:

定位有:

  1. 绝对定位
  2. 相对定位
  3. 固定定位

绝对定位:

属性:position属性值:absolute

相对定位:

属性:position属性值:relative

相对元素是相对于在页面中原来的位置,如果给了元素一个相对定位那么元素在页面中原来的位置会占位。

绝对定位:

属性:position属性值:fixed

固定定位是元素相对于浏览器窗口的定位

一般情况下,相对定位和绝对定位在页面中是成对使用的,给子元素一个x绝对定位给父元素一个相对定位。

特征:

  1. 如果给行内元素一个绝对定位那么这个行内元素可以设置宽高,如果给块元素一个绝对定位并且这个块元素还没有设置宽高,那么他的宽高是由内容撑起的
  2. 如果子元素有绝对定位那么不受父元素padding的影响。
  3. 如果子元素有浮动,父元素有绝对定位那么不用清楚浮动。

堆叠属性:

属性:z-index属性值:1~x(属性值是数值)

在页面中如果一个元素的堆叠属性的属性值大,那么这个属性值大的会堆叠在属性值小的上边,属性值没有单位。堆叠属性只能用在含有定位属性的元素上。


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Kotlin实战

Kotlin实战

【美】Dmitry Jemerov(德米特里·詹莫瑞福)、【美】 Svetlana Isakova(斯维特拉娜·伊凡诺沃) / 覃宇、罗丽、李思阳、蒋扬海 / 电子工业出版社 / 2017-8 / 89.00

《Kotlin 实战》将从语言的基本特性开始,逐渐覆盖其更多的高级特性,尤其注重讲解如何将 Koltin 集成到已有 Java 工程实践及其背后的原理。本书分为两个部分。第一部分讲解如何开始使用 Kotlin 现有的库和API,包括基本语法、扩展函数和扩展属性、数据类和伴生对象、lambda 表达式,以及数据类型系统(着重讲解了可空性和集合的概念)。第二部分教你如何使用 Kotlin 构建自己的 ......一起来看看 《Kotlin实战》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

URL 编码/解码
URL 编码/解码

URL 编码/解码

正则表达式在线测试
正则表达式在线测试

正则表达式在线测试