最近在设计网页的过程中遇到需要给输入框、图片框添加显示效果,最终觉得选择用CSS3样式比较容易实现这一效果。
现在分享一下心得,以contentBox元素为例。
在CSS样式表中添加下列样式,鼠标移至边框上便会实现发光效果。
.li:hover{
transition:border linear .2s,box-shadow linear .5s;
-moz-transition:border linear .2s,-moz-box-shadow linear .5s;
-webkit-transition:border linear .2s,-webkit-box-shadow linear .5s;
outline:none;border-color:rgba(255,0,0,0.5);
box-shadow:0 0 15px rgba(255,0,0,0.5);
-moz-box-shadow:0 0 15px rgba(255,0,0,0.5);
-webkit-box-shadow:0 0 15px rgba(255,0,0,0.5);
}