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

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

css3如何做從上往下漸顯的動(dòng)畫(huà)

css3如何做從上往下漸顯的動(dòng)畫(huà)

炎炎設(shè)計(jì) 2019-02-28 13:15:01
如題,等于一個(gè)遮罩層一樣從上往下逐漸顯示意思就是一張圖片要做一個(gè)三秒的漸現(xiàn)動(dòng)畫(huà),開(kāi)始從上往下顯示0%,然后30%,然后60%,然后100%應(yīng)該如何完成
查看完整描述

2 回答

?
揚(yáng)帆大魚(yú)

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

HTML:


<div class="gradient-wrapper">

  <img src="demo.png">

</div>

CSS:


@keyframes wrapper-gradient {

  0% {

    transform: translateY(-100%);

  }

  100% {

    transform: translateY(0);

  }

}

@keyframes img-gradient {

  0% {

    transform: translateY(100%);

  }

  100% {

    transform: translateY(0);

  }

}

.gradient-wrapper {

  display: inline-block;

  overflow: hidden;

  animation: wrapper-gradient 2s linear;

}

.gradient-wrapper>img {

  animation: img-gradient 2s linear;

}


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

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號(hào)

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