不多BB了 直接上代码了 通俗移动易懂总结了5种常用改变样式 的形式

  <style>

    .actived2{

      color:red;

    }

  </style>

</head>

<body>

  <div class="app">

    <div :style="actived">aaa</div>

    <div :style="[actived]">aaa</div>

    <div :style="{color:'red'}">aaa</div>

    <div :class="['actived2']">aaa</div>

    <div :class="{actived2:isActived}">aaa</div>

  </div>

</body>

<script>

  const app = new Vue({

    el:'.app',

    data:{

      actived:{

        color:"red"

      },

      isActived:true

    }

  })

</script>

vue---class和style的基本用法的更多相关文章

  1. Vue基础01vue的基本示例，vue的双向数据绑定，vue中常见的几种用法，vue相关常见指令

    自学vue框架,每天记录重要的知识点,与大家分享!有不足之处,希望大家指正. 本篇将讲述:vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令 前期学习基础,使用vue. ...

  2. vue class与style绑定、条件渲染、列表渲染

    列表渲染 根据我例子的需要,先来说下,列表渲染使用到的是v-for指令,需要使用 item in items 形式的特殊语法,items 是源数据数组并且 item 是数组元素迭代的别名,具体使用方法 ...

  3. 跨平台移动开发 Xuijs超轻量级的框架Style CSS属性用法

    PhoneGap里面推荐使用的超轻量级的框架 Style CSS属性用法 设置css属性:setstyle 通过ID设置css属性 x$('#top1').setStyle('color', '#DB ...

  4. vue文件中style标签的几个标识符

    .vue文件中style标签的几个标识符 在人生就要绝望的时候, 被编辑器所提示的一个scopedSlots所拯救. 卧槽, 写到最后才发现这个属性的具体卵用. 详情见最后解决办法. 问题背景 问题由 ...

  5. vue框架中props的typescript用法

    vue框架中props的typescript用法 在vue中使用typescript时,需要引入vue-property-decorator库来兼容格式. javascript写法 Vue.compo ...

  6. Vue#Class 与 Style 绑定

    绑定HTMLCLASS 在我没看这之前,我觉得要写绑定class ,应该像绑定数据一样这么写 class ={{class-a}} 看官方教程时,不推荐这么写,推荐这样 v-bind:class=&q ...

  7. vue class与style 绑定详解——小白速会

    一.绑定class的几种方式 1.对象语法 直接看例子: <div id="app3"> <div :class="{'success':isSucce ...

  8. VUE温习：style层次分析

    一.vue样式style层次分析 1.样式可以在main.js.模块js文件.组件style.组件script标签内,index.html文件内引入,不同位置引入的样式有什么关系. 2.总结: (1) ...

  9. 09.vue中样式-style

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. windows7x64系统中配置mysql5.7.17为本地开发环境（win2008类似）

    1. 下载mysql压缩包mysql-5.7.17-winx64.ziphttps://cdn.mysql.com//Downloads/MySQL-5.7/mysql-5.7.17-winx64.z ...

  2. OmniGraffle教程（二）

    原文链接:简书网 创建一个树形结构图是任何一个作图软件最常用的功能之一了,而OmniGraffle画树形图的快速方便是其他软件无法比拟的,花1分钟即可学会,受益无穷. 方法一:用Diagram工具快速 ...

  3. MYSQL LOGBIN 数据日志恢复数据库随笔

    查看指定的二进制日志中的事件(MYSQL命令行) mysql> show binlog events in 'binlogfullpath'; 查看二进制日志中的事件(MYSQL命令行) mys ...

  4. 8.Bootstrap CSS编码规范

    Bootstrap CSS编码规范 本节的介绍内容为 Bootstrap 中的 CSS 编码规范. 语法 用两个空格来代替制表符(tab) -- 这是唯一能保证在所有环境下获得一致展现的方法. 为选择 ...

  5. POP3、SMTP端口（SSL、TSL）

    POP3服务器地址: 110           995 支持SSLSMTP服务器地址: 25            465 或者 587 支持SSL(TSL) 465端口是SSL/TLS通讯协议的 ...

  6. JQuery学习---JQuery深入学习

    属性操作 $("p").text()    $("p").html()   $(":checkbox").val() $(".te ...

  7. 学习EChart.js（四） 移动端显示

    ECharts.js 移动端显示 现在很多时候,我们是在用手机.pad等一些移动端设备来进行办公获取数据.所以我们的图表很多时候是需要用移动端设置来查看的,而我们的图表有时候因为数据的偏多,会出现遮挡 ...

  8. 理解活在Iphone中的那些App （三）

    App的生存环境之宏观环境 从用户需求变成一个产品形体的App,是一个曲折的过程.主要的过程大概如此,分析用户需求,从用户需求中提炼出比较重要的部分,然后结合自己的创意,将其转化成产品.投放市场,接受 ...

  9. 从 Swift 中的序列到类型擦除

    如果有这样的一个需求,我希望能像数组一样,用 for 循环遍历一个类或结构体中的所有属性.就像下面这样: let persion = Persion() for i in persion { prin ...

  10. 【[SCOI2009]迷路】

    大水题一遍 过掉比较繁琐的拆点还是非常开心的 发现每一条边的边权可能不是\(1\),但是边权的范围非常小,同时点数也非常小,只有\(n<=10\),所以我们可以将一个点拆成九个点,之后随便一连边 ...