如何垂直水平居中 以及 小程序新建页面

新建页面

在文件夹中 创建 .wxml .wxss .js .json 四个文件夹 同时app.js 文件中的pages 数组里面 增加一项

pages 文件中 建立新的文件夹

在新的文件夹 右键 新建page  命名新的文件

app.json 中 pages 数组里面 增加 一项 新的文件夹的 路径

让开发者工具的模拟器 展示新的页面

app.json中 pages 数组里面 将 那条属性放到第一个 那条属性就是 小程序的 默认页面

在开发者工具的编译模式项里面  增加自定义编译 路径选择这个新的页面

编辑器里面  普通编译里面更改路径

页面报错找不到 可能是 JS文件中 Page  没有大写

插值绑定就是用双大括号括起来 {{}}

垂直水平居中

父级

display:none

justIfy-content:center

align-items:center

使用定位

父级

position:fixed/relative/absolute

子元素

position:absolute

top:50%  left:50%

情况一  子元素的宽高固定

marging:-子元素宽高度的二分之一

情况二 子元素的宽高不固定或者动态的

transform:translate(-50% -50%)

对于单行文本 子元素只是一个单行文本

可以在父标签上加  text-aling:center  line-height:父容器的高度

你可能感兴趣的:(如何垂直水平居中 以及 小程序新建页面)