Vue——08——使用内敛样式style

    技术2022-07-11  115

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="../lib/vue.js"></script> <style> .red { color: blueviolet; } .thin { font-weight: 200; } .ilalic { font-style: italic; } active { letter-spacing: 0.5em; } </style> </head> <body> <!-- 对象就是无序键值对的集合 属性有杠-就必须要加单引号,这是属性里键的规定--> <div id="app"> <!-- <h1 :style="{color:'red','font-style':'italic'}">我是一个h1标签</h1> --> <!-- <h1 :style="style1">我是一个h1标签</h1> --> <h1 :style="[style1, style2]">我是一个h1标签</h1> </div> <script> var vm = new Vue({ el: "#app", data: { style1:{color:'red','font-style':'italic'}, style2:{'font-weight':500} }, methods: { } }) </script> </body> </html>
    Processed: 0.012, SQL: 9