vue 基础 标签属性的总结

2019年10月10日 20:38:46

我也是一边看着文档视频 一边的去写

首先 先写一下自己会的  再写今天学的 这样有助于自己知识的总结

1.class   不要笑 class 起名字 记住 后面是" "并且 后面不需要跟,

<div class="test"></div>

2.v-bind:class 这么给自己解释 这就是class的儿子 ,学习java的都知道 子类继承父类 并且可以有自己的独特属性 也就是儿子是父亲基础上的加强

<div 
    class="test" 
    v-bind:class="[ isActive ? 'active' : '', isGreen ? 'green' : '']" 
　　<!--另外一种写法-->

　　v-bind:class="{'active':isActive}" 冒号前面的是属性  冒号后面的是取值

active:可以理解为布尔类型 true 是执行 

isActive 决定着active 相当于给active附属性

    <!--         宽度        高度                文字样式  居中            文字高度200 -->
    style="200px; height:200px; text-align:center; line-height:200px;">
        hi vue
    </div>

<!--         宽度        高度                文字样式  居中            行高度200 -->
    style="200px; height:200px; text-align:center; line-height:200px;"> 
这一块需要单独拿出来
英语不好的一定要记下来

.img{
  height:500px ;500px;
　设置与边框的距离 上 左 下 右 四个参数 中间空格
  margin: 20px 155px 0px ;
}