⼩程序前端知识点（1）
1../是当前  ../是上级==>在⼩程序⽂档结构。例：var util = require('../utils/util.js')
2.rpx和px的区别：200rpx =100px  rpx的实际像素⽐px的实际像素⼩⼀半 = 2/1    100px=200rpx
3.设置透明⾊(wxss)：opacity: 0;
4.设置层叠：z-index:10;
5.根据指定的时间跳转页⾯ setTimeout(function(){
url: '../index2zhu/index2zhu',
})
},5000  //设置的跳转时间数 ⼤约为5秒
)
6.flex布局（flex布局对排版重要）：
flex布局特点
⼀  任意⽅向的伸缩 向左右上下
⼆  在样式层可以调换和重排顺序
三  主轴和侧轴⽅便配置
四  ⼦元素的空间拉伸和填充
五  沿着容器对齐 ⼀⾏内显⽰和块状显⽰
伸缩容器：设有display:flex或者display:block的元素就是⼀个flex container==>也就是伸缩容器,
⾥⾯的⼦元素称为flex item===》伸缩项⽬  ，flex container也就是伸缩容器中都是使⽤flex排版
display:block 指定为快内容器模式 ⼀次沾满整⾏ 成⾏显⽰  ⼩⼩程序中放⼊视图容器中都是以display:block默认的
display:flex  指定为⾏内容器模式 在⼀⾏内显⽰所有⼦元素 同时 可以使⽤ flex-warp属性指定其是否换⾏ nowrap 不换          ⾏ warp 换⾏  warp-reverse 换⾏在第⼀⾏下⾯
⼆  主轴和侧轴 将其显⽰为块级元素 或者⾏级元素
容器默认有两个轴：主轴main axis和侧轴 cross axis
flex布局对齐方式
主轴开始位置为主轴起点main start  结束位置为主轴终点 main end  长度为主轴长度 main size
同理 侧轴开始位置为侧轴起点 cross start 侧轴终点 sross end 侧轴长度 crross  size
主轴的位置不⼀定是从左到右 侧轴 位置也不定是从上到下  主轴的⽅向控制使⽤flex-direction属性 有四个属性值 row 从          左到右为主轴 row-reverse从右到左为主轴    效果为⼀这样衡起  ⼀⾏⾥⾯包含多个元素 和display:flex效果相同
colum从上到下为主轴  colum-reverse从下到上为主轴 效果为1这样竖起和display:block效果相同
如果如果⽔平⽅向为主轴，那个垂直⽅向就是侧轴，反之亦然。
四    对齐⽅式  为成会计元素或者⾏级元素的定位以及位置⼦元素有两种对齐⽅式：
justify-conent 定义⼦元素在主轴上⾯的对齐⽅式
align-items 定义⼦元素在侧轴上对齐的⽅式
justify-content有5个可选的对齐⽅式:
flex-start 主轴起点对齐(默认值)
flex-end 主轴结束点对齐
center 在主轴中居中对齐
space-between 两端对齐，除了两端的⼦元素分别靠向两端的容器之外，其他⼦元素之间的间隔都相等
space-around 每个⼦元素之间的距离相等，两端的⼦元素距离容器的距离也和其它⼦元素之间的距离相同。    justify-content的对齐⽅式和主轴的⽅向有关
align-items表⽰侧轴上的对齐⽅式:
stretch 填充整个容器(默认值)
flex-start 侧轴的起点对齐
flex-end 侧轴的终点对齐
center 在侧轴中居中对齐
baseline 以⼦元素的第⼀⾏⽂字对齐
align-tiems设置的对齐⽅式，和侧轴的⽅向有关
======》flex布局显然过多但是知识含量丰富(会保持持续更新)

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。