css - 如何使不可见的文本输入框在悬停时可见？

Question

它似乎对我不起作用！

HTML

 <div id="box1">
     <form action="">
         <input type="string" name="htmlcode" />
     </form>
 </div>

CSS

#box1 {
    width:100px;
    height:100px;
    border-color:black 4px
}
input {
    display:none;
}
a:hover input{
    display:block;
}

文本输入要么不可见，要么可见但不响应悬停

score 3 · Accepted Answer

您没有a可以悬停以显示输入的标签...

将其更改为，#box1:hover input{display:block;}以便在您将鼠标移入框中时显示。

border-color:black 4px也是无效的。如果要设置边框颜色，只能给它一个颜色，不能给它颜色和大小。

这是一个演示，显示了已修复的这两个问题。

score 1 · Accepted Answer

1

你没有<a>在html。尝试：div:hover input{display:block;}

于 2012-08-08T17:21:58.577 回答

score 1 · Accepted Answer

1

在你的CSS中你需要添加这个

#box1:hover input{display:block;}

于 2012-08-08T17:23:24.843 回答

score 1 · Accepted Answer

 #box1 { 
    width:100px;
    height:100px;
    border:4px solid black;
}
 input {display:none;}
 #box1:hover input{display:block;}

正如其他人所提到的，您没有a标签，因此也要更改目标:hover。

还修复了边界声明。

4 回答 4