微信小程序开发教程(4)- 微信小程序页面wxml模板文件、wxss样式文件详解
深山老妖浏览:2192024-11-19 10:58:57本文累计收益:0我也要赚钱
一、wxml和html对比介绍

1、标签名称不同

html:div、span、img、a

wxml:view、text、image、navigator

2、属性名称不同

<a href="#">超链接</a>

<navigator url="/pages/home/home"></navigator>

3、提供了类似于Vue中的模板语法

数据绑定、列表渲染、条件渲染

二、wxss样式介绍

wxss是一套样式语言,用于描述wxml的组件样式,类似于网页开发中的css。下面说wxss和css的区别

1、新增了rpx尺寸单位:css中需要手动进行像素单位换算,例如rem。wxss在底层支持新的尺寸单位rpx,能在不同大小尺寸屏幕上自动进行换算。

2、提供了全局样式和局部样式:项目根目录中的app.wxss会作用于所有的小程序页面,局部页面的.wxss样式仅对当前页面生效。

3、wxss仅支持部分css选择器:.class和#id,element、并集选择器、后代选择器、::after和::before等伪类选择器。

 

评论列表
发表评论
+ 关注