郑州网站建设业务咨询热线：
0371-65349913 / 15333818157
0371-65349913 / 15333818157
在网页制作时，有时候为了达到好的效果，需要对网页上的链接进行修饰，比如当鼠标移动到链接文字或者链接图片上时，可以让链接显示下陷的效果，好像链接会活动一样，有一种向下陷下去的效果，本页面就来介绍一下这个技巧的实现。在这里，郑州网站建设公司的小编写出了一个利用CSS技术实现网页链接下陷的实例代码，并配以实例代码执行后的截图，来说明如何实现当鼠标滑动到网页链接上时，链接的文字和图片展现下陷的效果，本代码在各种浏览器上都测试过，可兼容各种主流浏览器，下面是代码执行后的截图：
下面列出来的是郑州网站建设使用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=gb2312" />
<title>利用CSS技术制作出网页链接的下陷效果</title>
<style type="text/css">
a:link,a:visited,a:active { text-decoration: none}
a:hover {text-decoration: none; position: relative; top: 1px; left: 1px}
</style>
</head>
<body>
<a href="http://www.kxcom.net/">郑州网站建设专家</a>----<a href="http://www.kxcom.net/">郑州凯讯公司</a>，是您的最佳合作伙伴！
<br><br>
<a href="http://www.kxcom.net/"><img src="wzjs.jpg" border="0" /></a>
</body>
</html>