vue通过style或者class改变样式

最新推荐文章于 2024-09-20 11:35:39 发布

吃瓜群众欢乐多

最新推荐文章于 2024-09-20 11:35:39 发布

阅读量2.3k

点赞数

分类专栏： VUE CSS

本文链接：https://blog.csdn.net/sinat_36146776/article/details/83539277

版权

VUE 同时被 2 个专栏收录

22 篇文章 0 订阅

订阅专栏

CSS

20 篇文章 1 订阅

订阅专栏

通过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>