本文已过期。推荐将小程序先转换为uni-app项目,详情;然后从uni-app编译为快应用,详情
==============================以下为过期内容========================
微信小程序其实就是运行在webview中的html网页,理论上支持符合w3c规范的所有css样式;快应用采用原生控件渲染,布局采用CSS Flexbox(弹性盒)样式,针对部分原生组件,对 CSS 进行了少量的扩充以及修改,具体请查看快应用文档快应用style样式。
DCloud推出的小程序转换工具,会完成快应用支持样式的自动转换,对于快应用不支持的css代码,转换工具会注释并加上备注,如下:
/*display:inline-block;
comment by uniapp*/
快应用和小程序的样式差异及解决方案
DCloud转换工具无法自动转换的样式定义,需要开发者手动修改部分代码,主要差异及解决方案示例如下:
- 伪类选择器:快应用不支持before、after等伪类选择器;开发者若在小程序中通过before/afetr伪类来画线画图标的,可改用border或是image组件解决;
- margin:0 auto;快应用不支持auto,若需居中显示,可通过给父元素添加align-items:center;实现
- 快应用颜色不支持 rgb 及 rgba,需转换为16进制颜色
- position:absolute;快应用不支持absolute,建议换成stack标签,实现该效果
- display:block/inline/inline-block;快应用不支持这几样式,导致转换后样式和预期不一致,开发者可以改变父元素的flex-direction值,子元素的flex-grow/shrink值以达到效果
2 个评论
该文章目前已经被锁定, 无法添加新评论
远一航一
y***@163.com