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="width:200px; height:200px; text-align:center; line-height:200px;">
        hi vue
    </div>

<!--         寬度        高度                文字樣式  居中            行高度200 -->
    style="width:200px; height:200px; text-align:center; line-height:200px;"> 
這一塊需要單獨拿出來
英語不好的一定要記下來

.img{
 height:500px ;width:500px;
　設置與邊框的距離 上 左 下 右 四個參數 中間空格
 margin: 20px 155px 0px ;
}