zoukankan      html  css  js  c++  java
  • vue样式的动态绑定

    true显示样式,flase不显示

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>vue的样式绑定</title>
     6     <style type="text/css">
     7     .active{
     8         background-color: gold;
     9         color:blue;
    10     }
    11 
    12     </style>
    13     <script type="text/javascript" src="./js/vue.js"></script>
    14     <script type="text/javascript">
    15 
    16     window.onload = function(){
    17 
    18         var app = new Vue({
    19             el:"#a",
    20             data:{
    21                 //激活 false
    22                 isactive:true
    23             }
    24 
    25         });
    26     }
    27 
    28     </script>
    29 
    30 </head>
    31 <body>
    32     
    33     <div id="a">人生最棒的是不后悔
    34     <div v-bind:class="{ active:isactive }" style=" 200px">
    35     人生最难的是不留遗憾
    36     </div>
    37     </div>
    38 
    39 </body>
    40 </html>
  • 相关阅读:
    线段树
    哈希,hash
    单调栈
    树的重心
    背包问题
    最小生成树
    二分图匹配
    题解 P6355 [COCI2007-2008#3] DEJAVU
    题解 P6745 『MdOI R3』Number
    题解 P2080 增进感情
  • 原文地址:https://www.cnblogs.com/sunzhiqi/p/10101301.html
Copyright © 2011-2022 走看看