vue通过style或者class改变样式

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/sinat_36146776/article/details/83539277

通过style改变样式

<div :style="{ 'min-height': size + 'px' }"></div> 
<div :style="[{ 'min-height': size + 'px' },{color:'red'}]"></div> 
<div :style="{ 'opacity': value ? 0.5 : 1 }"></div> 

通过className改变样式

可以写一个"class"加一个":class"

​<div class="static"
     v-bind:class="{ active: isActive, 'text-danger': hasError }">
</div>

<script>
data: {
  isActive: true,
  hasError: false
}
</script>

<style>
.content{
    ...
}
.active{
    ...
}
.text-danger{
    ...
}
</style>

猜你喜欢

转载自blog.csdn.net/sinat_36146776/article/details/83539277