526互联

sass样式穿透，深度作用选择器, 父选择器

发布时间 2023-04-23 12:01:43作者: 冲锋的凉菜

scss

.el-input-number {
  ::v-deep #inputNumber {
    text-align: left;
  }
}

css

.el-input-number >>> #inputNumber {
    text-align: left;
  }

&

a {
    font-weight: bold;
    &:hover { color: red; }
}

#main {
    color: black;
    &-sidebar { border: 1px solid; }
}

编译为

a {
    font-weight: bold;
    a:hover { color: red; }
}

#main {
    color: black;
    #main-sidebar { border: 1px solid; }
}