开始

官方的介绍
image.png

image.png

实战

image.png

image.png
flex布局，水平居中和垂直居中。
image.png

image.png

image.png

image.png
绑定多个class属性
image.png
加上这两个class属性
image.png

image.png
通常不会这么去写
image.png
一般会动态的绑定成一个变量
image.png
然后通过一些事件去控制
image.png

三元运算符

image.png
大于10岁才有class1属性
image.png
当前是1岁

image.png
改成11
image.png
边框就加上了。
image.png
加上红色标识
image.png

image.png

image.png
改成男
image.png
没有红色
image.png

前面显示class，后面显示条件。
image.png

image.png
边框加上了
image.png

image.png

image.png
条件可以加多个
image.png

image.png
字体红色
image.png

style支持的语法

直接绑定在style上是不支持upx的，所以这里直接用px
image.png

image.png
声明一个变量color
image.png
属性绑定要用冒号
image.png
并且还要加上花括号。属性用单引号括起来。或者是驼峰的写法。
image.png
image.png

image.png
注意这里一定是逗号
image.png
注意双引号和单引号的位置。
image.png

image.png

结束