龙空技术网

关于CSS样式中position(定位)

哪有弄么复杂哦 236

前言:

当前小伙伴们对“css定位position”可能比较重视,朋友们都想要知道一些“css定位position”的相关知识。那么小编在网络上汇集了一些对于“css定位position””的相关知识,希望兄弟们能喜欢,你们快快来学习一下吧!

关于CSS样式中的定位

对于css中的属性position(定位)来说,确实在网页布局上减少了很多麻烦,它可以将任何元素定为到页面上,相对于其他布局方式来说更加简便。它主要分为三种定位:

一、相对定位

position : relative;相对定位通常是相对自身来进行定位,在自身原来位置上进行移动,它不会改变元素的类型,属于没有完全地脱离文档流,不会影响后面元素的位置。通常情况下,它一般用作绝对定位的父级。

二、绝对定位

position :absolute;绝对定位是指在父级发生相对定位的情况下,子级进行以父级为参照的定位,如果说父级没有发生相对定位时,则它以<body>为参照进行定位。通常使用绝对定位会使元素类型变为行内块,会影响后面元素的位置。使用absolute定位后,定位元素是脱离文档流的,这时候父级会检测不到定位元素的宽高。inline元素使用absolute定位之后,可以对其设置宽高;元素是不可以同时使用绝对定位和浮动的。

三、固定定位

position : flxed; 固定定位于前面两种不同,它是相对于浏览器进行定位,固定在整个屏幕的某个位置,并且不会随着鼠标滚轮进行移动,通常用作回到顶部、页边广告等,定位层级z-index一般较高。固定定位也会使元素类型变为行内块,影响后面元素的位置。

关于CSS中position的使用就简单介绍到这里,希望能够对您的布局有帮助,若有错误和好的补充欢迎讨论,谢谢!

标签: #css定位position