有没有办法在CSS中合并输入及其占位符类？

Question

我有一个简单的输入元素，如下所示：

我对元素及其占位符文本的样式设置如下：

input {
 height: 40px;
 width: 600px;
}

input::placeholder {
  padding: 10px;
  line-height: 1.5em;
  color: #959595;
  font-size: 14px;
}

我可以在CSS中将这两部分合并为一个块吗？有可能吗？

谢谢

Answer 1

取决于您的意思！

// input.scss
input {
    height: 40px;
    width: 600px;
    &::placeholder {
        padding: 10px;
        line-height: 1.5em;
        color: #959595;
        font-size: 14px;
    }
}

我建议您使用SASS之类的东西进行轻松控制。 （变量等）

{{1}}

Answer 2

使用香草CSS不可能做到这一点，但是sass可以做到这一点：

input {
 height: 40px;
 width: 600px;

  &::placeholder {
    padding: 10px;
    line-height: 1.5em;
    color: #959595;
    font-size: 14px;
  }
}

Sass使您可以将子选择器嵌套在其父内部，并使用&来代表父。 css tricks上的无礼＆符更多。