CSS元素定位与设置元素透明度

本文详细介绍了CSS中的position属性,包括static、relative、absolute和fixed四种定位方式,以及如何使用opacity设置元素透明度。内容实用,适合前端开发者学习实践。
摘要由CSDN通过智能技术生成

CSS元素定位与设置元素透明度



一.定位:position属性

1.static:

默认值,没有定位。

2.relative:

相对定位,相对自身原来位置进行偏移。

偏移设置:top,left,right,bottom

设置相对定位的盒子会相对它原来的位置,通过指定偏移,到达新的位置

设置相对定位的盒子仍在标准文档流中,它对父级盒子和相邻的盒子都没有任何影响

设置相对定位的盒子原来的位置会被保留下来

相对定位的特性:

相对于自己的初始位置来定位

元素位置发生偏移后,它原来的位置会被保留下来

层级提高,可以把标准文档流中的元素及浮动元素盖在下边

相对定位的使用场景:

相对定位一般情况下很少自己单独使用,都是配合绝对定位使用,为绝对定位创造定位父级而又不设置偏移量

代码示例:

<style
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

道而起

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值