嘿,我创建了一个HTML文件,该文件使用Java脚本显示了一个onmouseover跨度,但是其下的文本正在下降。我不知道该如何解决此问题。请帮助我,这是我的HTML,CSS和一些javascript代码

<html><body><style>.Category{
background-color: rgb(77, 178, 236);
padding: 8px 12px;
width:10px;
height:500px;
margin:4px;
font-family: 'Roboto Condensed',sans-serif;
color: white !important;
z-index: 1;
}
.fblike
{
display: none;
position:relative;
top:-25px;
right:-600px;
width:20px;
}</style>
<div id="content"><div id="content1" onmouseover="document.getElementById('fblike').style.display = 'block';" onmouseout="document.getElementById('fblike').style.display = '';"><span class="Category">How TO</span> <span id="fblike" class="fblike">Utkarsh</span><br><br><div class="image">Utkarsh</div></div><hr>
</body></html>

最佳答案

您需要将.fblike类定位为绝对类,然后修改css中的top和right属性以适合。

我在这里显示了此内容:http://jsfiddle.net/drfjy/

10-06 00:52