图像鼠标悬停时显示文字？
我试图当鼠标移到图像的左下方时出现一个小框。在该框内，将有一个指向其他页面的链接。
这有点类似于我想要的东西，但是盒子要更小并且不连接到图像的边框。
我已经尝试了一切，但找不到答案。而且我不想使用工具提示，更不用说我没有任何JavaScript知识了。我真的希望这是CSS。
问题答案：
这是:hover在CSS3中使用伪元素。
HTML：
<div id="wrapper">
<img src="http://placehold.it/300x200" class="hover" />
<p class="text">text</p>
</div>
CSS：
#wrapper .text {
position:relative;
bottom:30px;
left:0px;
visibility:hidden;
}
#wrapper:hover .text {
visibility:visible;
}
相反，这是使用jquery达到相同结果的一种方式：
HTML：
<div id="wrapper">
<img src="http://placehold.it/300x200" class="hover" />
<p class="text">text</p>
</div>
CSS：
#wrapper p {
position:relative;
bottom:30px;
left:0px;
visibility:hidden;
}
jQuery代码：
$('.hover').mouseover(function() {
$('.text').css("visibility","visible");
});
$('.hover').mouseout(function() {
$('.text').css("visibility","hidden");
});
您可以将所需的jquery代码放在HTML页面的 主体 中，然后需要将jquery库包含在 头部， 如下所示：
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
当您想在网站上使用它时，只需更改其<imgsrc/>值即可添加多个图像和标题，只需复制我使用的格式即可：用class="hover"和插入图像class="text"
-
我正在使用这个WP主题，我正在努力调整代码，以便内容框中的标题和描述只在悬停时显示（此时它们总是显示，悬停只会使图像变暗）。 以下是相关代码（据我所知）： .home\u特色化\u post\u last{右边距：0；} .home\u特色\u post\u悬停{位置：绝对；顶部：0；左侧：0；宽度：100%；高度：100%；显示：块；文本装饰：无；边框半径：5px；} .home_特色_post
-
我有这个样本： 链接 CODE超文本标记语言： 所有人都能清楚地理解错误所在，并能清楚地了解所有人的行为，包括发明者的行为，并能清楚地了解自己的真实性和准建筑风格。 代码CSS： 代码JS: 我希望div
-
我有一个应用程序，我想在
-
当我在图表上移动鼠标时，如何修复图表js错误，使其显示旧数据。 我的Js文件 我可以在图表js中显示JSON响应中的数据，但当我在图表上移动鼠标时，它的问题显示了以前的值。 我曾试图破坏这种方法，但并没有奏效。如何预防这个问题？？。
-
我认为我的问题是一个已知的问题，每次我制作一个新的图表，并将鼠标悬停在画布上的一些点上，旧的图表总是会闪进闪出。这是我试图修复它的一个线程，但似乎没有任何效果。我试图重新添加画布，使用破坏，清除，如果语句应该清除它，但什么都没有。 这是我的代码： 我尝试添加
-
问题内容： 我将鼠标悬停在图像上时要显示说明。我已经以一种不太理想的方式做到了这一点，在这里使用了图像精灵和鼠标悬停：我希望它看起来像我的样子，但是使用真实文本而不是图像。 我尝试了几种不同的方法，但似乎无法弄清楚该怎么做。我正在尝试仅使用HTML和CSS进行操作，但不确定是否可行。 请随意在我的代码中四处浏览，我将粘贴我认为与之相关的内容。 HTML 这很简单。将图片和“出现在悬停时”说明包装在