html文本框在焦点时显示提示

时间:2010-01-13 14:38:56

标签: html css

如何在焦点处创建一个在右侧显示提示的文本框?

示例:http://www.airbnb.com/rooms/new (点击地址文本框)

2 个答案:

答案 0 :(得分:4)

没有javascript也可以。

<input type="text" value="Focus me to see a hint!" style="width: 200px; height: 30px;"/>
<div>Congratulations, you found me !</div>

.input + div {
    display: none;
    position: relative;
    top: -30px;
    left: 200px;
}

.input:focus + div {
        display: block;
}

享受;)

答案 1 :(得分:1)

使用占位符

很简单
<input type="text" placeholder = "your gray text" />