微信小程序中的position问题

2017-04-21 11:39:06来源:CSDN作者:WickedDogg人点击

如果同时将一个position不为static的容器内的多个块position设置为absolute,开发者工具和安卓端会正常表现,即从容器左上角开始算起,依据设置的top,right,bottom,left来定位,像下面这样

而在测试ios时候,表现有所差异,如果只设置某一边,比如说我设置了蓝块的top=0,黄块的bottom,那么我们期待的应该是这样表现

这里写图片描述

但实际上在ios上测试的时候出现了这样的情况

这里写图片描述

在ios中,为了表现效果,设计者将position的某些情况做出了一定的调整,但是这些调整对于开发者来说并不一定友好,这种情况下就需要开发者做出一定的调整。

上面这种情况其实很好解决,只需要在两个方向上设置一定的值就行了,比如将黄块的left设置为0,就和图二表现一样了。

小程序的开发者工具只能观察到在不同大小的屏幕和dpi上的表现情况,而实际上开发者工具,安卓端,ios端三个平台的内核有所不同

  • 开发者工具上小程序是运行在nwjs内核上
  • 安卓端小程序运行在X5内核中
  • ios上小程序运行在JavaScriptCore中

所以搞清楚这些差异,有些问题就好理解了。

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台