登录 | 注册
小程序交流 +关注 已有0人关注 +发表新主题

微信小程序与HTML5的标签差异梳理

发表在 2019-3-13 09:06 来自PC 复制链接 手机看帖 扫一扫!手机看帖更爽 0 513

微信小程序与HTML5的标签差异梳理

微信小程序与HTML5的标签差异梳理
小程序自己开发了一套WXML标记语言和WXSS样式语言,并非直接使用标准的HTML5+CSS3因此,粗略的统计了一下之间的差异,有助于理解小程序,同时遇到HTML5转换小程序的时候,知道如何避开其中的坑。
小程序标签大约为32个左右:
view(视图容器)、rich-text(富文本)、swiper(滑块视图容器)、icon(图标)、text(文字)、progress(进度条)、button(按钮)、form(表单)、input(输入框)、checkbox(多项选择器)、radio(单项选择器)、picker(列表选择器)、slider(滚动选择器)、switch(开关选择器)、textarea(多行输入框)、label(标签)、navigator(应用链接)、audio(音频)、image(图片)、video(视频)、camera(系统相机)、map(地图)、scroll-view(可滚动视图容器)、picker-view(内嵌列表选择器)、canvas(画布)movable-area(可移动区域)、movable-view(可移动的视图容器)、cover-view(覆盖视图)、cover-image(覆盖图片)、functional-page-navigator(跳转到插件功能页)、live-player(实时音视频播放)、live-pusher(实时音视频录制)
小程序
HTML5
说明
<view>
div、h1、h2、h3、h4、h5、h6、p、span、acronym、abbr、address、b、bdi、bdo、big、blockquote、center、cite、code、del、dfn、em、font、i、ins、kbd、mark、meter、pre、q、rp、rt、ruby、s、samp、small、strike、strong、sub、sup、time、tt、u、var、wbr、header、footer、section、article、aside、ul、li、ol、dl、dt、dd、table、tbody、thead、tfoot、tr、colgroup、col、td、th、caption
a标签href属性不是有效的地址,标签转为view
<text>
div、h1、h2、h3、h4、h5、h6、p、span
<text>具有长按选中的属性,当标签内只有文字,将标签转换为<text>
<rich-text>
hr、br
<icon>
<i class="icon"></i>
<icon>可以直接用微信组件默认的图标
<input type="text">
<input />
<input type="checkbox">
<checkbox-group><checkbox />
</checkbox-group>
<input type="radio">
<radio-group>
    <radio /></radio-group>
其它:
微信小程序的app.json文件需要手动添加支持的页面路径
需要引用weui.wxss文件,作为基础样式框架的样式

扫描二维码,手机查看本帖
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

返回顶部
快速回复 发贴