構建前端第6篇之---內嵌css樣式 登錄

張艷濤寫於2021-1-20日

What: 如何讓button的長度和input長度一致呢

 

 

 

 

 

 

 

 

 

 

 

 

最先想到的是給這個button加一個class ="buttonclass",然后在vue最后的<style標簽中>設置

.buttonclass {
    width : 100%;
}

這個前兩篇設置height為100%的方法是一致的.

還有一個更簡單的方法就是內聯式css

<el-form-item><el-button > 登錄 </el-button></el-form-item>

並且css樣式代碼要寫在style=""雙引號中，如果有多條css樣式代碼設置可以寫在一起，中間用分號隔開。如下代碼：

<p style="color:red;font-size:12px">這里文字是紅色。</p>

三種插入樣式的優先級：

三種插入樣式優先級從高到底為：內聯式>嵌入式>外部式
其中嵌入式>外部式的條件為：嵌入式CSS的位置在外部式的后面
可以理解為：就近原則--離被設置元素越近優先級別越高