使用樣式穿透,強制覆蓋Vant原樣式

2021-10-11 21:07:27 字數 541 閱讀 8981

使用vant元件的時候,我們會發現在某些場合元件的原樣式不符合我們的需求,這個時候我們就需要重寫元件的原樣式。

這個是元件的原樣式:

因為style標籤新增了scope屬性,scope會保護樣式不被汙染,這裡要讓我們自己的樣式生效就必須使用樣式穿透,由父樣式穿透到子樣式:

.w-all >>> .van-field__control

在瀏覽器可以看到:

text-align:left那一欄已經被一條橫線劃掉,取而代之的是:

而這個,就是因為使用了樣式穿透強制覆蓋了原樣式,從而實現我們需要的樣式效果。

撤底覆蓋vant框架樣式

vant的樣式採用less所寫,所以,如果你期待通過如下方式修改 weui cells 的樣式。是沒有任何效果的 這是因為,所有的scoped中的css最終編譯出來都會變成這樣 data v 17bb9a05 weui cells data v 17bb9a05 解決方法一 除非你將 scoped ...

Vue無法覆蓋Vant樣式的問題

問題描述 開發專案的時候有用到van collapse item元件,底色預設白色,需求是灰色底色,加了額外的class不生效 解決方案 在class前面加上 deep 示例 dym collapse deep van collapse item content 外麵包一層dym collapse是...

Linux 使用 cp 命令強制覆蓋功能

我們平常在linux中使用 cp 命令時,會發現將乙個目錄中檔案複製到另乙個目錄具有相同檔名稱時,即使新增了 rf 引數強制覆蓋複製時,系統仍然會提示讓你乙個個的手工輸入 y 確認複製,令人不勝其煩.那麼這是由於什麼原因引起的?要知道原因,你可以在命令列中輸 我們平常在linux中使用 cp 命令時...