将鼠标悬停在字段上时如何在字段中显示符号 up/log

Question

#aanmelden:hover {

}

#inloggen:hover {

}

<ul class="nav navbar-nav navbar-right">
 <li id="aanmelden"><a href="#">Sign Up</a></li>
 <li id="inloggen"><a href="#">Log In</a></li>
 </ul>

当您将鼠标悬停在 Log In/Sign Up 上时，它必须显示 registration/login 表格。
我是否必须先隐藏表格，然后在悬停时显示它们？ login/sign 向上表单将与幻灯片重叠。

提前致谢！

Answer 1

HTML

<ul class="nav navbar-nav navbar-right">
        <li id="aanmelden"><a href="#">Sign Up</a>
            <div class="drop">
                <input type="text">
            </div>
        </li>
        <li id="inloggen"><a href="#">Log In</a>
             <div class="drop">
                <input type="text">
            </div>
           </li>
    </ul>

CSS

.drop{
    display: none;
}
li:hover .drop{
    display: block;
}

fiddle link

将鼠标悬停在字段上时如何在字段中显示符号 up/log

How do I show a sign up/log in field when hovering over it

html

css

hover