通常在引入第三方 UI 組件庫（如 element-ui或者easyUI等等），需要自定義組件樣式時，但由于樣式使用了 scoped 屬性（為避免組件之間的樣式相互影響），導(dǎo)致無法直接覆蓋原組件的樣式，這時就需要用到樣式穿透。

CSS使用樣式穿透的方法有以下幾種：

1、使用 >>>符號：

.container >>> .el-input__inner {
    width: 160px;
}

 該方法適用的樣式語法：css、stylus

2、使用 /deep/：

.container /deep/ .el-input__inner {
    width: 160px;
}

該方法適用的樣式語法：sass、scss、less

3、使用 ::v-deep：

::v-deep .el-input__inner {
    width: 160px;
}

 該方法對所有樣式語法通用，即適用于 css、stylus、sass、scss 和 less

其中/deep/ 和 ::v-deep 屬于深度選擇器。

到此這篇關(guān)于CSS樣式穿透的幾種方法的文章就介紹到這了,更多相關(guān)CSS樣式穿透內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持腳本之家！