欧美成人片一区二区三区,久久碰人妻一区二区三区,久久婷婷激情综合色综合俺也去,狂野欧美性猛交免费视频,久久夜色精品国产亚洲

24
2017/06

css3鼠標(biāo)劃過如何出現(xiàn)陰影

發(fā)布時(shí)間:2017-06-24 16:27:45
發(fā)布者:369563174
瀏覽量:
0

在有的網(wǎng)站中,有些地方鼠標(biāo)劃過去會(huì)有個(gè)陰影出來,那么它是怎么寫出來的,我們?cè)谧銎瞻铐?xiàng)目的時(shí)候就用到了這個(gè)陰影的寫法:

blob.png

你會(huì)發(fā)現(xiàn)它底部跟左右兩側(cè)都有一點(diǎn)點(diǎn)陰影,它是這么寫出來的:


      
            
  •         
  •         
  •         
  •         
  •         
  •         
  •         
  •         
  •         
  •         
      
.anli-nr li{ -webkit-transition: all .2s linear; transition:all .2s linear ;}
.anli-nr li:hover{-webkit-box-shadow: 0 15px 30px rgba(0,0,0,0.2);
box-shadow: 0 15px 30px rgba(0,0,0,0.2);
-webkit-transform: translate3d(0, -2px, 0);
transform: translate3d(0, -2px, 0)}

就是加了個(gè)過度,然后用css3中的box-shadow屬性給li加了個(gè)陰影,這樣就顯示出來了

演示地址:http://www.xcyouyuan.com.cn/d/demo/yinying/

上一篇: js實(shí)現(xiàn)時(shí)間軸自動(dòng)排列效果
下一篇: 一個(gè)頁面如何使用多個(gè)swiper插件?
關(guān)鍵詞:
返回列表
相關(guān)文章
相關(guān)案例
熱門文章
最新文章