css 行通过输入值，但不是占位符

fdx2calv 于 2023-10-21 发布在其他

关注(0)|答案(1)|浏览(85)

我得到了一个html输入，并希望添加一个
text-decoration: line-through;
设置为值（如果验证失败，则设置特定的css类）。
我不希望它出现在占位符上，我试图通过添加一个

input::placeholder {
   text-decoration: none; 
}

很不幸这不管用。有没有办法做到这一点？

1条答案

使用:not(:placeholder-shown)排除占位符时的情况

input.error:not(:placeholder-shown) {
  text-decoration: line-through;
}

<input type="text" placeholder="example" class="error">

<input type="text" placeholder="example">