微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

CSS偏移属性和静态位置

偏移属性(左,上,下,右)仅适用于非静态位置吗?

它们可以应用于静态定位的元素吗?如果是这样,有什么区别
将它们应用于非静态定位元素?

解决方法

要偏移一个元素,它的位置必须是位置:相对

坐标,顶部,右侧,底部和左侧用于不同的目的,取决于元素是相对还是绝对定位.

什么是元素偏移而不是移动?

当你实际使用position:relative;该元素不会从流中移除,实际上,如果元素保持静态(认值),则该元素将占用的空间仍为其保留,因此您只需将其从原始位置偏移即可.它后面的任何元素都会出现在它可能已经完成的位置,即使你没有抵消它的前身 – 就像这个example

移动,而不是抵消

但是,如果你真的想要移动一个元素,那么它需要从流中删除,所以没有为它保留空间,然后当你使用position:absolute时;或固定..这是差异

摘要

> static是认值,你只需使用边距移动它,它将忽略坐标和z-index
> relative是保留空间,坐标将偏离它的原始空间
>绝对将从流中移除元素,坐标将根据它的containing block计算,这是最近的相对位置的祖先(或者如果没有相对定位的祖先存在的身体元素)
> fixed没有包含块,即你不能指定它应该相对于哪个元素定位,它只是相对于视口固定自己

最后一个元素不接受z-index如果它的位置是static的认值,那么position:relative;没有任何坐标应用类似于静态,但它对z索引很有用,并且是绝对定位元素的包含块

原文地址:https://www.jb51.cc/css/213985.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。