Vue項目中使用iview input標籤去掉邊框的方法!!!!!!!!!!!!!!!!!!!!

1.錯誤寫法
html中 :

 <Input class="jm-input" size="large" v-model="jmName" placeholder="請輸入你的大名" />
css中 :

.ivu-input{
      border: none!important;
    }
嘿嘿,不生效。。。。。。。

2.正確寫法
寫法1:深度監聽樣式--------推薦

 css中 :

使用/deep/深度監聽樣式

<style lang="less" scoped>
 /deep/.ivu-input{
      border: none!important;
    }
</style>
 

寫法2:新建樣式標籤,重置樣式

 css中 :

要重新建個標籤,同時裏面不能寫scoped的。

<style>
 .ivu-input{
      border: none!important;
    }
</style>
 
<style lang="less" scoped>
 // .ivu-input{
 //    border: none!important;
 //  }
</style>
 

發佈了42 篇原創文章 · 獲贊 6 · 訪問量 9056
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章