在标签中放置输入字段,在焦点上更改bgcolor

时间:2013-06-07 08:59:50

标签: html css css3

所以我要做的是将输入字段放在标签上并更改焦点上输入字段的背景颜色。这样bgColor就会覆盖标签的文本。

这是它的样子:

<div class="d-faq-field">
  <label class="i-faq-lastname-label" for="i-faq-lastname">Nachname</label>
  <input id="i-faq-lastname" type="text" name="lastname">
</div>

我已将输入字段和标签都放在div中,以便每个事件都能响应并且div可以相互浮动。

另外,请查看jsFiddle。顶部有一个div已经可以工作了,但我似乎无法正确地重建它。

2 个答案:

答案 0 :(得分:1)

如果我很好理解,请尝试简单地

input:focus {
   position: relative;
   z-index: 1;    
}

因此,当输入被聚焦时,它将覆盖标签。无论如何,当输入失去焦点时,你会再次看到标签。

可能只需使用placeholder属性

即可获得正确的行为

答案 1 :(得分:0)

我不知道我是否理解,但为什么不使用占位符属性?

<textarea id="i-question2" required="required" type="search" name="question" placeholder="Gib hier deine Frage ein"></textarea>