固定定位的一个使用

小米商城中一个固定定位的使用

在这里插入图片描述

弄一个滚动条,滑动的来看看,就知道了,固定定位是相对视口的,不是相对于html的

下面的图就是left要自动增加的宽度

在这里插入图片描述

要使得那个等式成立,按照需要,left要加宽,因此,我们可以使用margin来配合使用

但是,要注意的是,如果此处对margin-left来设置的话,由于margint-left是移动自己,此时,left又要增大(+),要使得等式成立,margin-left前面的符号需要是“-(减号)”,这样会导致,虽然式子满足,但是.back-top不会移动的,因为抵消了

因此,综上所述,我们可以采用对margin-right进行设置,此时,要满足等式成立,且left要增大的话,此时margin-right需要为“负号”,但是,值得注意的是,给自己设置margin-right,是移动的别人,意味着他自己的位置不会因为margin-right的设置,而直接移动,但是,等式成立的需要,left的增大,会导致.back-top的位置向右间接移动

但是,我有个疑问是,为什么视口的宽度小于1226px时,那个.back-top消失了

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

另外一个奇怪的问题是,为什么,视频课里面的等式关系,没有写padding和border

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值