vuejs 4 绑定样式

9.绑定样式
div id="app">




    <div :style="{color:red,fontSize:fontSize}"> div标签</div> 绑定样式
    <div :style="styleObject"> div标签</div>绑定样式对象
    <p :class="classA">p标签</p>绑定样式
  <img :src="imgSrc">
</div >


<style type="text/css">
    .classA{
        color: red;
        font-size: 50px;
    }
    .classB{
        color: green;
        font-size: 50px;
    }
</style>
<script type="text/javascript">
    var app = new Vue({
//        节点的id
        el:'#app',
        data:{
           isLogin:false,
            message:100,
           fenshu:0,
           fenshu2:12345123,
            classA:'classA',
            classB:'classB',
            imgSrc:'https://www.baidu.com/img/fnj_96d95207b4a706738f1b8be3b41ea9f3.gif',
            red:'red',
            fontSize:'20px',
            styleObject:{
               color:"red",
               fontSize:"20px"
            }


        }})

猜你喜欢

转载自blog.csdn.net/qq874039013/article/details/79562766