无法使用 input[value=""] 选择空输入？ [复制]

Question

我正在尝试像这样标记必需（和空输入）

input:required {
  border: 1px solid green;
}
input[value=""]:required {
  border: 1px solid red;
}

<input type="text" value="" required>

<input type="text" value="Not empty" required>

它似乎可以工作，但是一旦你为输入设置了一个值，它仍然被标记

Answer 1

如果您不介意使用 JavaScript，您可以使用 if 语句根据输入是否包含文本来给出类。 然后在这些类上使用你的 CSS。