将焦点放在文本框上时，将占位符显示为标签，而不是“必需”文本框

Question

我想在单击文本框时将占位符显示为标签。我做了“必需的”文本框。

<input type="text" class="inputText" required>

但如何在不需要的情况下实现这一目标：

<input type="text" class="inputText">

我尝试了https://jsfiddle.net/273ntk5s/3680/

Answer 1

您需要删除

.user-input-wrp .inputText:not(:focus):valid ~ .floating-label

你的css的一部分，因为当字段为“：valid”时你应用“焦点”样式。如果不需要，那么它会自动“有效”。