css之透明度和外发光

今天用到了CSS中的透明度和外发光，分享一下，希望能帮到大家

透明实例

<div class="box"></div>
<style>
    .box{width:300px; height:200px;margin:0 auto; boxder:1px solid #ccc; background:#000;
         filter:alpha(opacity:30);      //这是一个针对IE浏览器
         opacity:0.3;                   //值为1时，完全不透明，为0时完全透明，opacity为css的现代标准，适用于绝大浏览器
</style>

如图：

外发光实例

<style>
.aa:HOVER{
      -webkit-transition:-webkit-box-shadow linear .05s;  
//transition的过渡，对阴影部分的逐步过渡，还可以用 border linear .2s ，这是说border属性的逐步过渡，两个设置之间用 , 分隔
       border-color:rgba(25,39,142,.5);
//rgba（a，b，c，d），前三位凑成颜色，而第四位则是透明度 
       -webkit-box-shadow:0 0 20px rgba(251,56,15,365);
//box-shadow：x y 10px rgba（a，b，c，d），x y分别是阴影的方向， 然后是阴影蔓延距离，最后则是阴影部分的颜色； 
        }
.aa{
       height: 100px;width: 100px;
    }
</style>
<div>
     <input type="text" class="aa"/>
</div>

如图：

自己写的，如有错误，还望路过大佬指点和海涵