position定位
position定位
_好久不见 发表于2年前
position定位
  • 发表于 2年前
  • 阅读 35
  • 收藏 1
  • 点赞 0
  • 评论 0

【腾讯云】如何购买服务器最划算?>>>   

position定位有四种:

static--静态定位

relative--相对定位

absolute--绝对定位

fixed--固定定位


fixed和absolute的相同点:

一、完全脱离标准文档流。

二、未设置偏移量时,都定位在父元素的左上角。(偏移量--元素设置定位【绝对或相对】后就具有偏移属性和堆叠属性【z-index】)。


fixed和absolute的不同点:

一、设置偏移量时,偏移参照基准不同

absolute:

1.无已定位祖先元素,以<html>为基准偏移,而不是以<body>为基准偏移。

2.有已定位祖先元素,以距其最近的,已经定位的祖先元素为基准偏移。

fixed:

1.无论是否有已定位的祖先元素,都以浏览器的可视窗口为基准偏移。

二、未设置偏移量时

fixed:

1.有定位的祖先元素:以祖先元素为基准定位。

2.以浏览器窗口为基准定位。


当元素设置绝对定位却没有设置宽度时,元素的宽度根据内容进行调节。


相对定位:

1.相对于自身原有位置进行偏移。

2.处于标准文档流中。

3.拥有偏移属性和z-index属性。

共有 人打赏支持
粉丝 9
博文 24
码字总数 17310
×
_好久不见
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: