CSS定位

本文详细介绍了CSS定位,包括定位的组成:定位模式和偏移量。定位模式涵盖静态、相对、绝对、固定和粘滞定位,解释了它们的特点和参照位置。例如,相对定位不改变元素在文档流中的位置,而绝对定位使元素脱离文档流。偏移量如top、bottom、left和right用于调整元素位置。
摘要由CSDN通过智能技术生成

定位的组成 

定位也是用于布局的,主要由两个部分组成:   

 定位=定位模式+偏移量

定位模式用于指定一个元素在文档中的定位方式。

偏移量则决定了该元素的最终位置

偏移量

当元素开启了定位之后,可以通过偏移量来设置元素位置

top:定位元素和定位位置上边的距离

bottom:定位元素和定位位置下面的边距

left:定位元素和定位位置左侧距离

right:定位元素和定位位置右侧距离

开启定位

语法规则

选择器{   

 position:定位模式

}

定位模式

1.静态定位

 div{      

position: static;  

 } 特点:静态定位 按照标准流特性摆放位置,它没有边偏移

2.相对定位(relative)

 div{      

position: relative;

} 特点:

1.元素开启相对定位以后,如果不设置偏移量元素不会发生任何变化

2.相对定位会提升元素的层级。

3.相对定位不会使元素脱离文档流。

4.相对定位不会改变元素的性质块还是块,行内还是行内。

参照位置:    

 相对定位是参照于元素本身在文档流中的位置进行定位

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值