回旧版

我爱导航网_我爱网址导航_网站酷站免费导航,尽在我爱导航!

帝国CMS鼠标滑过超链接文本显示图片

一个鼠标滑过超链接文本显示图片的应用。主要用途就是,鼠标放到他一个文字连接上,显示他的二维码图片用的,好吧,只要不是华丽丽的效果,就不用JS搞了,直接上CSS用相对和绝对定位搞定了!

下面的代码大家自已清除一下无用的吧,我懒得搞了,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>鼠标滑过,显示图片!</title>

<style type="text/css">

<!--

#mainCon{margin-top:100px}

.thumbnail {position:relative;z-index:0;}

.thumbnail img{border-width:0;padding:2px;position:absolute;background-color:#FFFFE0;left:0px;border:1px dashed gray;visibility:hidden;color:#000;text-decoration:none;padding:5px;}

.thumbnail:hover img{visibility:visible;top:20px;left:0px;}


-->

</style>


</head>


<body>

<p id="mainCon"><a class="thumbnail" href="#">这里是文字这里是文字这里是文字这里是文字<img src="http://www.moyublog.com/skin/moyublog/images/random/titlepic/2.jpg" /></a></p>

</body>


</html>


文章来自:我爱导航,未经允许不得转载!:首页 > 教程收藏 > 建站经验 » 帝国CMS鼠标滑过超链接文本显示图片

感觉不错,很赞哦! ( )

相关推荐

网友评论