css制作的一个链接图片边框特效

发布时间：2014-08-18 11:03:22　来源/作者：学技巧网页制作　分类：图片特效阅读：0次点评一下

<!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> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css"> p#outer { position:relative; float:left; margin-top:20px; margin-left:20px; background: blue; } #outer a { margin:0; background-color:blue; display:block; position: relative; border:2px dashed red; } #outer a:hover {border:2px dashed #CCFFCC;} #outer img {display:block;border:none;background:#ffffcc;padding:4px;} </style> </head> <body> <h1>Hover over the image to see the double border effect</h1> <p id="outer"><a href="#"><img src="http://www.xuejiqiao.com/statics/images/logo.png" alt="example image border" width="180" height="86" /></a> </p> </body> </html> <a href="http://www.xuejiqiao.com/texiao/">欢迎访问学技巧网站制作网页特效集</a>

(www.xuejiqiao.com)提示：可修改后再运行代码!

css制作的一个链接图片边框特效，可自定义颜色。Hover over下的边框变化

本文版权归原作者所有，转载请注明原文来源出处，学技巧网站制作感谢您的支持！

学技巧网站制作

css制作的一个链接图片边框特效

JS实现鼠标点亮或熄灭灯泡特效

非常适合商品宣传的jquery幻灯切换特效

仿淘宝商品宝贝图片放大效果js特效