第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題，去搜搜看，總會(huì)有你想問(wèn)的

如何在懸停圖像時(shí)放置 GIF？

如何在懸停圖像時(shí)放置 GIF？

萬(wàn)千封印 2023-09-28 10:13:39
大家好，我真的需要你們的幫助。我是網(wǎng)絡(luò)開(kāi)發(fā)的初學(xué)者，最近我開(kāi)始使用 html、css 和 js 制作我的第一個(gè)網(wǎng)站。我想在頁(yè)面中央放置 2 張將成為超鏈接的圖像（一張?jiān)谧髠?cè)，一張?jiān)谟覀?cè)）。我希望當(dāng)我將鼠標(biāo)懸停在這兩個(gè)圖像上時(shí)顯示我的 GIF（GIF 在我將鼠標(biāo)懸停在圖像上時(shí)開(kāi)始，在我將鼠標(biāo)懸停在圖像上時(shí)結(jié)束）。此外，GIF 還會(huì)有文本疊加和其他一些懸停動(dòng)畫(huà)。有什么可以幫助我的嗎？ 這是原型（草圖） 提前致謝，
查看完整描述

2 回答

?
冉冉說(shuō)

TA貢獻(xiàn)1877條經(jīng)驗(yàn) 獲得超1個(gè)贊

這是一個(gè)可以幫助您實(shí)現(xiàn)目標(biāo)的示例。您也可以在codepen上查看：https://codepen.io/assar777/pen/jOMbpeP

 <style>

    #image{

    background-image:url('https://image.freepik.com/free-photo/image-human-brain_99433-298.jpg');

    height:400px;

    max-width:400px;

    background-position:center;

    background-repeat:no-repeat;

    background-size:cover;

    }

    #image:hover{

    background-image:url('https://media.emailonacid.com/wp-content/uploads/2019/03/2019-GifsInEmail.gif');

    }

    </style>

    

    <div id="image"></div>


查看完整回答
反對(duì) 回復(fù) 2023-09-28
?
桃花長(zhǎng)相依

TA貢獻(xiàn)1860條經(jīng)驗(yàn) 獲得超8個(gè)贊

如果可以的話?。?/p>


您可以使用 CSS 本身來(lái)做到這一點(diǎn)，例如：


.classeOfMyImage{

?background: url('http://dummyimage.com/100x100/000/fff');

}

.classeOfMyImage:hover {

?background: url('https://media.tenor.com/images/1fe5b893dd6eb6905c4efabb103e6281/tenor.gif');

}


查看完整回答
反對(duì) 回復(fù) 2023-09-28
  • 2 回答
  • 0 關(guān)注
  • 122 瀏覽
慕課專(zhuān)欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)