久久无码中文字幕_日韩精品无码一本二本三_久久精品呦女暗网_欧美一级夜夜爽_久久精品国产99久久99久久久

咨詢電話：
15628812133
24
2017/06

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

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

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

blob.png

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


      
    
        
    • 
        
    • 
        
    • 
        
    • 
        
    • 
        
    • 
        
    • 
        
    • 
        
    • 
        
    • 
        
       
.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è)過(guò)度，然后用css3中的box-shadow屬性給li加了個(gè)陰影，這樣就顯示出來(lái)了

演示地址：http://www.geizy.cn/d/demo/yinying/

上一篇： js實(shí)現(xiàn)時(shí)間軸自動(dòng)排列效果
下一篇： 一個(gè)頁(yè)面如何使用多個(gè)swiper插件？
關(guān)鍵詞:
返回列表
相關(guān)文章
相關(guān)案例
熱門文章
最新文章
濟(jì)南網(wǎng)絡(luò)公司聯(lián)系我們
聯(lián)系我們
CONTACT US
公司電話：0531-68961230 QQ:1828686598
公司地址：濟(jì)南市天橋區(qū)中凡魯鼎廣場(chǎng)A座20樓2009
高新技術(shù)企業(yè)編號(hào)：GR202437006411
科技中小企業(yè)編號(hào)：2024370105A8014257
關(guān)注我們濟(jì)南網(wǎng)絡(luò)公司
關(guān)注我們
FOCUS ON US
咨詢電話濟(jì)南網(wǎng)絡(luò)公司
咨詢電話：
15628812133
濟(jì)南網(wǎng)絡(luò)公司 濟(jì)南網(wǎng)絡(luò)公司 濟(jì)南網(wǎng)絡(luò)公司
山東文匯信息服務(wù)有限公司版權(quán)所有 濟(jì)南軟件開發(fā) 魯ICP備14002804號(hào)-1 公安備案號(hào) 37010502000882