将鼠标悬停在输入标签上不起作用

Question

http://jsfiddle.net/leongaban/6vwLetd6/13/

我有一个自定义注册表单，其样式来自 Codrops demo page。

基本上在悬停时我想为标签文本设置动画（让它淡入和淡出）但现在只是试图让文本将颜色更改为红色：

.input__label-content--jiro:hover {
  color: red !important;
}

<span id="full_name_label" class="input input_jiro">
  <input class="input__field input__field--jiro" type="text" id="input-1" />
  <label class="input__label input__label--jiro" for="input-1">
    <span class="input__label-content input__label-content--jiro">
      Full Name
    </span>
  </label>
</span>

然而，当您将鼠标悬停在 "Full Name" 上时，颜色不会改变。你能看出是什么阻碍了 hover 效果吗？

Answer 1

我删除了 pointer-events: none 声明并且它起作用了。

看看JSFiddle。

所以我认为你只需要根据auto值覆盖这个即可=> Docs

这是你想要的吗？？

将鼠标悬停在输入标签上不起作用

Hover over input label not working

html

css

hover