收藏
回答

关于absolute绝对定位在小程序wxss使用中与理论不符的问题?


网上找的各文档中对于微信小程序的绝对定位(absolute)的描述是:元素是相对离它最近的一个父级元素进行定位.,(fix)是相对窗口大小进行定位。实际使用过程中发现:在父元素超过、或小于窗口边界时,absolute是相对窗口进行定位的,这与理论中相对父级元素定位不符,现象很奇怪,希望高手解释。

如图 icon right 60rpx bottom 60rpx 不应该出现在父级元素外侧

回答关注问题邀请回答
收藏

1 个回答

  • LeeJim🌀
    LeeJim🌀
    2020-03-18

    absolute是相对于设置了position: relative的父元素定位的,如果没有,则相对于根元素(也即是视窗);

    因此你应该给contain增加relative的定位

    2020-03-18
    有用 1
    回复 2
    • 2020-03-18
      谢谢解答,明白了。
      2020-03-18
      回复
    • 戴佳莱考完了!
      戴佳莱考完了!
      2023-07-17回复
      “absolute 相对于设置了 position: relative 的元素定位“ 是不准确的,你和 LeeJim 都只说了一半的定义。实际上 absolute 定位是相对于最近的一个被定位过的父元素进行定位的,也就是 position 属性不为 static 的最近的父元素,如果一个也没有则根据根元素进行定位。你的例子里因为 contain 没有设置 position 属性,默认就是 static,所以找到了视口进行定位。实际上你只要设置任意的 position 值给 contain,就可以让它内部的元素相对于它来进行定位。https://developer.mozilla.org/zh-CN/docs/Web/CSS/position#%E5%8F%96%E5%80%BC
      2023-07-17
      回复
登录 后发表内容
问题标签