图片边框变换CSS Hover状态效果一例

　　我们可能会经常用到此效果，在传统的做法中，这一效果的实现是比较困难或繁琐的，现在通过CSS实现鼠标移至图片，边框发生变换的效果，是非常容易的。我们看下面的代码。

　　CSS代码：
 Example Source Code:
p#outer {
     margin:0 auto;
     width:202px;
 }
#outer a {
    margin:0px;
    display:block;
    position: relative;
     border:1px solid #069;
}
#outer a:hover {border:1px dashed #c00;}
#outer img {display:block;border:none;background:#069;}

　　XHTML代码：

 Example Source Code:
<p id="outer"><a href="#">
<img src="/Files/1.gif?http://www.xvna.com" alt="www.cnwebshow.com" width="200" height="90" /></a>
</p>