vant UI庫修改樣式無效

2021-09-29 04:30:19 字數 579 閱讀 2934

最近用vue寫頁面時,發現使用vant的有些ui元件,而又不能滿足自己的樣式,修改css樣式還是無效。css一般都會使用sass或者less,加了scoped後修改的樣式不起作用,即使加了important也沒用

vue專案中,當標籤有scoped屬性時,它的 css 樣式只作用於當前元件中的元素,父元件的樣式將不會滲透到子元件中。

解決辦法:1.對於css語法起作用

使用深度選擇器,使用 >>> 操作符,將scoped樣式中的選擇器「深入」,即影響子元件

上述**將會編譯成:

2.對於scss,less這類的預處理器

使用 /deep/ 操作符取而代之——這是乙個 >>> 的別名

**如下:

這樣修改樣式就有效啦

el tooltip 如何修改樣式

el tooltip 如何修改樣式 el tooltip標籤又popper class testtooltip 屬性可以給元件建乙個選擇器名。通過atooltip可以直接修改el tooltip.placement bottom popper class testtooltip slot conte...

input點選修改樣式

geren type button value 個人獎勵 style border top style none border right style none border left style none border bottom style none width 48 bumen type b...

修改樣式 如何防止樣式被私下修改

大家可以看到,儘管修改樣式非常簡單,但是要自定義一套較好的文件樣式,並不是那麼容易的一件事,因為這裡還涉及到一些個人審美素養與設計靈感的問題,或者還有單位的特殊需求。因此,當對乙個文件模板的標題樣式做好了設定之後,我們會希望對樣式進行加密保護。不讓普通使用者隨意的對樣式進行修改。怎麼設定呢?可以這樣...