您好,登錄后才能下訂單哦!
這篇文章主要講解了“vue中使用/deep/失效如何解決”,文中的講解內容簡單清晰,易于學習與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學習“vue中使用/deep/失效如何解決”吧!
1. 若是沒有使用像less, sass等這樣的css預處理器, 那么是只能使用 >>>這樣的css深度選擇器
<style scoped> .box >>> el.dialog { } </style>
2. 若是使用了css預處理器,則可以使用/deep/, 如果/deep/ 無效,則使用 ::v-deep
<style scoped lang="scss"> .box /deep/ el.dialog { } </style>
或
<style scoped lang="scss"> .box ::v-deep el.dialog { } </style>
3. 如果使用了css預處理器,使用/deep/ 和::v-deep 都失效,那么需要看看style 上是不是沒有加上 scoped。若加上了還是無效,那么就只能把代碼寫入全局css中了,但是需要注意用一個css類包裹起來,不然會改變很多全局樣式。
<style> .box .el-dialog { } </style>
或
<style lang="scss"> .box .el-dialog { } </style>
感謝各位的閱讀,以上就是“vue中使用/deep/失效如何解決”的內容了,經過本文的學習后,相信大家對vue中使用/deep/失效如何解決這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是億速云,小編將為大家推送更多相關知識點的文章,歡迎關注!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。