vue如何修改el-form-item中的label樣式修改問(wèn)題
更新時(shí)間：2023年10月17日 09:11:10 作者：__十七
這篇文章主要介紹了vue如何修改el-form-item中的label樣式修改問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
修改el-form-item中的label樣式修改
操作步驟
1，style標(biāo)簽中不要加scoped
2，在對(duì)應(yīng)的el-form-item的label標(biāo)簽屬性中加入class屬性
3，在style標(biāo)簽中，先找到label對(duì)應(yīng)的class，在修改label
<el-form-item label="用戶(hù)名" class="item">
<el-input v-model="ruleForm.username" placeholder="請(qǐng)輸入用戶(hù)名" maxlength="10"></el-input>
</el-form-item>
<style lang="less">
.item .el-form-item__label{
color: blake;
}
</style>
vue使用elementUI form表單label樣式修改
1.刪除style標(biāo)簽中的 scoped 屬性
<style lang="lang" scoped>
...
</style>2.在對(duì)應(yīng)el-form-item的label屬性中加入class樣式
<el-form-item label="用戶(hù)名" class="item">
<el-input v-model="ruleForm.username" placeholder="請(qǐng)輸入用戶(hù)名" maxlength="10"></el-input>
</el-form-item>3.審查元素，找到label對(duì)應(yīng)的class
如：.el-form-item__label 添加如下樣式代碼
.item .el-form-item__label{
color: wheat;
}總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Pinia實(shí)現(xiàn)數(shù)據(jù)持久化存儲(chǔ)實(shí)踐
安裝pinia-plugin-persist插件,引入并掛載后啟用數(shù)據(jù)緩存（默認(rèn)存入sessionStorage）,可通過(guò)paths自定義持久化字段,未指定的state將不進(jìn)行緩存2025-07-07
vue 右鍵菜單插件 簡(jiǎn)單、可擴(kuò)展、樣式自定義的右鍵菜單
這篇文章主要介紹了vue 右鍵菜單插件 簡(jiǎn)單、可擴(kuò)展、樣式自定義的右鍵菜單，本文給大家分享個(gè)例子，給大家及時(shí)的非常詳細(xì)，具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2018-11-11
Vue設(shè)置頁(yè)面輪詢(xún)實(shí)現(xiàn)方式
這篇文章主要介紹了Vue設(shè)置頁(yè)面輪詢(xún)實(shí)現(xiàn)方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2025-11-11
這篇文章主要介紹了Vue3之事件綁定的實(shí)現(xiàn)邏輯,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-11-11
關(guān)于導(dǎo)入、配置Vuetify遇到的幾個(gè)問(wèn)題
這篇文章主要介紹了關(guān)于導(dǎo)入、配置Vuetify遇到的幾個(gè)問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
本文主要介紹了?vue全局引入scss,我們?cè)趯?xiě)VUE的時(shí)候,會(huì)使用scss，也會(huì)做一些通用樣式,方便使用,在寫(xiě)好的通用樣式的時(shí)候,每次都要單文件導(dǎo)入,剛開(kāi)始寫(xiě)的時(shí)候,感覺(jué)還好,后面工程量大了后,就顯得麻煩,那么本文就全局導(dǎo)入scss樣式,下面來(lái)看詳細(xì)內(nèi)容,需要的朋友可以參考一下2021-11-11
vue 實(shí)現(xiàn)element-ui中的加載中狀態(tài)
這篇文章主要介紹了vue 實(shí)現(xiàn)element-ui中的加載中狀態(tài)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-11-11
vue實(shí)現(xiàn)el-table點(diǎn)選和鼠標(biāo)框選功能的方法
在Vue中我們經(jīng)常需要處理表格數(shù)據(jù),這篇文章主要給大家介紹了關(guān)于vue實(shí)現(xiàn)el-table點(diǎn)選和鼠標(biāo)框選功能的相關(guān)資料,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-10-10
vue實(shí)現(xiàn)驗(yàn)證碼倒計(jì)時(shí)按鈕
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)驗(yàn)證碼倒計(jì)時(shí)按鈕，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-08-08
vue多頁(yè)面開(kāi)發(fā)和打包正確處理方法
這篇文章主要介紹了vue多頁(yè)面開(kāi)發(fā)和打包的正確處理方法，非常不錯(cuò)，具有參考借鑒價(jià)值,需要的朋友可以參考下2018-04-04