vue的class和style
更新:HHH   时间:2023-1-7


    <!DOCTYPE html>

    <html>

        <head>

            <meta charset="utf-8" />

            <title>class和style</title>

        </head>

        <script type="text/javascript" src="js/vue.js" ></script>

        <script>

            window.onload = function(){

                //配置是否允许检查代码,方便调试,生产环境中设置为false

                Vue.config.devtools = true;  //检查代码

                Vue.config.productioinTip = false;  //有强迫症的,可以关掉生产中的提示信息

                let vm = new Vue({

                    el: "#div1",

                    data:{

                      pp:'a',

                      p2:{a:true,b:true}, //可以用json格式,true就是为启用,false就是禁用

                      sty:{color:'blue'}  //style形式

                    }

                });

            }

        </script>

        <style type="text/css">

            .a{background-color: yellow}

            .b{font-size: 20px;}

        </style>

        <body>

            <div id="div1">

                <p :class="p2">class属性</p>

                <p :>style属性</p>

            </div>

        </body>

    </html>


返回开发技术教程...