Vue项目：style样式篇

========

使用场景：根据不同的值使用不同的样式，或者给样式某个属性设置一个变量值

使用方法：

• 使用不同的class

：class=" {  ‘classA’ : f，‘classB’：g } "    //条件f成立则使用style标签中定义好的classA样式，条件g成立则使用classB样式

:class=“[isState==true?‘text’:‘text1’]” //isState是true样式是text，是false这是text1

• 使用style设置某个变量的值

：style=“{‘width’:widthLength+‘px’}”   //给width一个变量值widthLength

• 使用计算属性calc(100% - 100px)

一般只能计算宽度高度，注意中间的减号“-”，前后一定要加空格，并且父级的高度宽度一定要有，可以100%，否则使用无效。

• 使用函数绑定样式：

:style=“{‘color’:formateTitleColor(val)}”

//格式化标题颜色

formateTitleColor(val){

if(val<24 && val>=0){

return ‘#f7b13f’

}

if(val>=24){

return ‘#000’

<