vue学习

vue 修改Vant UI库自带的样式

2020-09-22  本文已影响0人  工程狮子

1.因为我现在的项目是用Vant作为UI库,今天经理让修改一下Vant自带的样式,发现修改的样式无效。于是上网查了一下。

(1)css 一般会使用sass或者less,加了scoped后修改的样式不起作用,如果不加scoped好使,但是单页面应用如果不加会影响别的页面的样式,后来我又加了important也不好使。

.van-field__label {
    line-height: 0.8rem !important;
  }

(2)解决方法
对于scss,less这类的预处理器
使用/deep/
代码如下:

<style lang="scss" scoped>
 /deep/.van-field__label {
    line-height: 0.8rem;
  }
</style>

这样写的话就好使了。
参考链接: https://blog.csdn.net/tattoo_jie/article/details/108210318

上一篇下一篇

猜你喜欢

热点阅读