Javascript 如何在reactjs中移动标签？

**如果可能的话，我想在使用JavaScript或CSS单击输入字段时将标签向上移动一点**

这是HTML部分

<div className="inputbox">
        <div className="label">
           <img src={icon} alt="" width={width} height={height} />
           <label htmlFor={type}>{labelText}</label>
        </div>
        <input type={type} name={type} className="authInput" required />
     </div>

---

您的问题是选择器与html结构不匹配。您正在匹配前面有输入字段的每个标签类。

~

选择器只能从左到右工作，而不能从左到右工作，这在您的情况下会更好

现在，您可以切换

输入

和

div

字段，或者在元素被聚焦时使用Javascript应用样式

.inputbox input:focus + .label,
.inputbox input:valid + .label{
  position: absolute;
   top: -18px;
   left: 0;
}

我将~sign改为+sign，它现在正在工作

---

input:focus~。label

查找匹配的html结构：

请参阅。您的HTML在此处需要javascript:（-/--CSS将无法在此处执行此操作。谢谢，我知道您可以更新问题（&title）以了解如何在reactjs/javascript中执行此操作并删除CSS标记；），然后该问题不再是重复的，可以重新打开，否则请删除它并询问另一个关于react的问题；）这不可能与您在问题中提供的标记一起工作。这工作非常好，您最好再次学习css：（更可能的情况是，您需要了解什么是css。

.inputbox input:focus + .label,
.inputbox input:valid + .label{
  position: absolute;
   top: -18px;
   left: 0;
}