vue项目中使用 vant 组件无法修改css样式

原因：当 style 标签里有scoped属性时，在scoped作用域组件样式中，默认只能在作用在组件的根节点，如果需要影响其后代元素，需要使用深度选择器深度选择器// 深度选择器 : /deep/ ::v-deep 最后一个只作用于...

原因：当 style 标签里有scoped属性时，在scoped作用域组件样式中，默认只能在作用在组件的根节点，如果需要影响其后代元素，需要使用深度选择器

深度选择器

  //   深度选择器 : /deep/ ::v-deep  >>> 最后一个只作用于css
  /deep/ .van-nav-bar__title {
    max-width: unset;
    .search-btn {
      width: 555px;
      height: 64px;
      background-color: #5babfb;
      .van-icon {
        font-size: 32px;
        color: #fff;
      }
      .text {
        font-size: 28px;
      }
    }
  }