页面是小程序开发过程中的基本单元，每个页面都以单独的文件夹存放在pages目录下，页面文件夹包含四个文件，分别是 .js文件、.json文件、.wxml文件和 .wxss文件。
新建页面
在app.json文件的pages数组下新增页面的存放路径，保存，小程序开发工具会帮我们自动创建对应的页面。比如我们要新建一个detail的页面，操作如下：
在pages数组下添加代码
"pages/detail/detail"
添加完之后的pages数组
"pages": [
"pages/index/index",
"pages/logs/logs",
"pages/detail/detail"
]
页面在pages中的位置代表实际加载的顺序，如果需要把新建页面当作小程序的首页，只需要把新建页面放到数组的第一位即可。
页面中的WXML
什么是WXML
WXML（WeiXin MarkUp Language）是小程序的标签语言，用来构建小程序页面的结构，其作用类似于网页开发中的HTML。
WXML和HTML的区别
- 标签名称不同
对应常用的标签，比如布局标签、文本标签、 图片标签和页面跳转标签，在HTML和WXML中分别对应如下：
- HTML（div、span、img、a）
- WXML（view、text、image、navigator）
- 属性节点不同
以页面跳转标签为例
- HTML <a href="#">超链接</a>
- WXML<navigator url="pages/index/index"></navigator>
- WXML提供了类似于Vue中的模板语法
- 数据绑定
- 列表渲染
- 条件渲染
页面中的WXSS
什么是WXSS
WXSS（WeiXin Style Sheets）是一套样式语言，用于描述 WXML 的组件样式，类似于网页开发中的CSS。
WXSS和CSS的区别
- WXSS新增了 rpx 尺寸单位
- CSS 需要手动的像素单位换算，如 rem
- WXSS 在底层支持新的尺寸单位rpx，在不同尺寸的屏幕上小程序会自动进行换算
- WXSS提供了全局样式和局部样式
- 项目根目录下的 app.wxss 作用于所有小程序页面
- 每个页面文件夹下的 .wxss 仅对当前页面生效
- WXSS仅支持部分CSS选择器
- .class 和 #id
- element
- 并集选择器和后代选择器
- ::after 和 ::before 等伪类选择器
页面中的 .js 文件
什么是JS
JS （JavaScript的简称）是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。
小程序中的 .js 文件
在小程序中，我们通过 .js 文件来处理用户的操作，实现用户和界面之间交互。如用户的操作，获取用户位置等。小程序中的 .js 文件可以分为三类
- 全局的 app.js
- 是整个小程序项目的入口文件，通过调用 App() 函数来启动小程序
- 页面的 .js 文件
- 是页面的入口文件，通过调用 Page() 函数来创建并运行页面
- 普通的 .js 文件
- 是普通的功能模块文件，用来封装常用的公共函数或者属性，供页面使用
页面中的 .json 文件
什么是JSON
JSON是一种数据格式，实际开发中经常以配置文件的形式出现。
配置页面
小程序的每一个页面，都可以使用 .json 文件来配置本页面的窗口外观，当全局的配置和页面的配置冲突时，页面中的配置会覆盖 app.json 中的全局配置项。
