html - 圆 Angular png图片边框发光效果

请看一下这个 fiddle :http://jsfiddle.net/SkjHs/4/

<html>
<ul class="langBar">
  <li><a href="?lang=az&amp;page=main"> <img src="http://goo.gl/aIxpv"> </a></li>
  <li><a href="?lang=en&amp;page=main"> <img src="http://goo.gl/wIQob"> </a></li>
  <li><a href="?lang=ru&amp;page=main"> <img class="activeLang" src="http://goo.gl/If4lA"> </a></li>
</ul>
</html>

html {
background-color:#000;}
.langBar{
    display: block;
    overflow: hidden;
    float: left;
    width: 125px;
}

.langBar li{
    display: block;
    width: 32px;
    height: 40px;
    float: left;
    margin-left: 7px;
    padding: 0px;
}

.activeLang{
    -moz-border-radius: 20px;
    width: 32px;
    height: 32px;
    border-radius: 20px;
    border: 2px solid #482663;
}

.langBar li a{
    display: block;
    height: 100%;
    width: 100%;
}

我正在尝试围绕 activeLang 类图像实现一些不错的发光效果。第一个问题是，我在边框和图像本身之间填充。二是无法获得发光效果。有什么建议吗？

最佳答案

首先图像的填充是因为图像 Canvas My Fiddle

裁剪了 Canvas 的图像

enter image description here