悬停图像时显示包含文本的框

时间:2011-11-24 16:41:10

标签: css mousehover

我是网站建设的新手,所以我真的很挣扎!

我有一块PCB板/主板的图像,我希望在用户将其悬停时显示该组件的文本。我的网页上有我想要的图像(它可能是一个页面,因为它是我的Joomla网站的子域名。)

最简单的方法是什么?

我想创建不同的css样式,即组件U5和U6等的U5,当用户在图片上悬停在U5上时,它将显示文本“U5做这个和那个”。那可能吗?如果是,我该怎么办?

我通过网站空间上的index.php获取图片,并且有文本指向css,但现在我卡住了!

任何帮助将不胜感激。 亲切的问候, 马特

2 个答案:

答案 0 :(得分:1)

不确定你需要什么 但最简单的解决方案之一是将img划分为地图并添加alt文本,以便在用户将鼠标悬停时显示。 看这个例子: http://www.noobcube.com/tutorials/html-css/css-image-maps-a-beginners-guide-/ 这是w3schools教程: http://www.w3schools.com/tags/tag_area.asp

或更高级的方法是显示<DIV>元素而不是替代文字

答案 1 :(得分:0)

只需输入您的文字标题:

<a href="yadiyadiya.com" title="Text that you want to be appear when hover"><img name="logo" src="link to picture" width="40" height="40"></a>