最近中文字幕高清中文字幕无,亚洲欧美高清一区二区三区,一本色道无码道dvd在线观看 ,一个人看的www免费高清中文字幕

為了賬號安全,請及時綁定郵箱和手機立即綁定

CSS3圖片動態(tài)提示效果

jack.xu Web前端工程師
難度初級
時長 1小時12分
學(xué)習(xí)人數(shù)
綜合評分9.53
159人評價 查看評價
9.9 內(nèi)容實用
9.3 簡潔易懂
9.4 邏輯清晰
  • css3原來還有這些功能
    查看全部
    0 采集 收起 來源:課程介紹

    2017-02-09

  • transition:all 2s 表示所有的屬性都將參與動畫
    查看全部
  • Html5語義化標(biāo)簽 figure標(biāo)簽 用于規(guī)定獨立的流內(nèi)容(圖像、圖表、照片、代碼等) figcaption標(biāo)簽 與figure配套使用,用于標(biāo)簽定義figure元素的標(biāo)題 例: <figure> <img alt="" src=""> <figcaption></figcaption> </figure> CSS3屬性 transform以及transition transform為css3屬性,主要用于元素的變形處理 屬性:translate(平移),rotate(旋轉(zhuǎn)),scale(縮放),skew(斜切)
    查看全部
  • transform的四種基本屬性:平移,旋轉(zhuǎn),扭曲,縮放
    查看全部
    0 采集 收起 來源:課程總結(jié)

    2017-01-12

  • transform:translate 是相對于當(dāng)前自己的位置定位的
    查看全部
  • p:nth_of_type(1){transition-delay:0.05s} p:nth_of_type(2){transition-delay:0.05s} p 標(biāo)簽同級的兄弟元素
    查看全部
    0 采集 收起 來源:CSS3 平移動畫

    2017-01-12

  • figure:figcaption{h5新增標(biāo)簽:規(guī)定獨立內(nèi)容提高圖片識別效率,配套使用
    查看全部
  • 父容器中有相對定位時,子容器中的絕對定位就根據(jù)父容器
    查看全部
    0 采集 收起 來源:HTML基本樣式

    2017-01-11

  • @media screen and (min-width: 1001px){ figure{width: 33.3%;} } @media screen and (max-width: 600px){ figure{width:100%;} } @media screen and (min-width:600px) and (max-width: 1000px){ figure{width:50%;} }
    查看全部
    1 采集 收起 來源:CSS3 扭曲動畫

    2017-01-06

  • opacity:0.8; 透明度 <link rel="stylesheet" type="text/css" href="styleA.css" media="screen and (min-width: 400px)"> 當(dāng)屏幕的寬度大于等于400px的時候,應(yīng)用styleA.css 在media屬性里: screen 是媒體類型里的一種,CSS2.1定義了10種媒體類型 and 被稱為關(guān)鍵字,其他關(guān)鍵字還包括 not(排除某種設(shè)備),only(限定某種設(shè)備) <link rel="stylesheet" type="text/css" href="styleB.css" media="screen and (min-width: 600px) and (max-width: 800px)"> 當(dāng)屏幕的寬度大于600小于800時,應(yīng)用styleB.css @media screen and (max-width: 600px) { /*當(dāng)屏幕尺寸小于600px時,應(yīng)用下面的CSS樣式*/ .class {background: #ccc; } } -moz-transition: width 2s; /* Firefox 4 */ -webkit-transition: width 2s; /* Safari 和 Chrome */ -o-transition: width 2s; /* Opera */
    查看全部
    0 采集 收起 來源:CSS3 平移動畫

    2018-03-22

  • 媒體查詢可以備用在css中的@media 和@import 規(guī)則上 @media sreen and (width:800px){ 樣式 } @import url(example.css) screen and (width:800px) <link media="screen and (width:800px)" rel="stylesheet" href="example.css" />0
    查看全部
    0 采集 收起 來源:媒體查詢

    2018-03-22

  • transform:all 2s ease-in 1s; transform:translate(xpx,ypx)平移//all所有指定元素 2s 過渡動畫時間 ease-in/ease out 慢速開始,然后變快 /慢速結(jié)束的過渡效果 1s 推遲多久才執(zhí)行 transform:width 2s ease-in 1s; //指定寬度
    查看全部
  • transition過度動畫處理 ie6-9 不支持 property:檢索或設(shè)定對象中的參與過渡的屬性 duration 過渡動畫時間 delay 檢索或設(shè)置對象延遲過渡的時間 timing-function 檢索或設(shè)置對象中過渡的動畫類型(linear ease ease-in ease-out ease-in-out)
    查看全部
  • translate 指定對象的2dtranslation 第一個x軸 第二個y軸 第二個參數(shù)未提供則默認(rèn)0 例如 transform:translate(10px,10px); 平移 rotate 旋轉(zhuǎn) 需要選有transform-origin屬性的定義 (設(shè)定元素的中心點) rotate(90deg) ,transform-origin:0 0; scale 縮放 transform:scale(1.3,1.3);/*縮放 無單位*/ skew 斜切 transform:skew(10deg,2deg);/*斜切 單位deg*/ transform-origin:0 0; /*旋轉(zhuǎn)中心點 定義 00 左上角*/ transform:rotate(0deg); /*旋轉(zhuǎn)*/ transform:translate(10px,100px;); /*平移*/ transform:scale(1.3,1.3);/*縮放 無單位*/ transition: transform 3s;
    查看全部
  • transform transition transform css3屬性 主要用于元素變形處理 屬性:translate 平移 rotate 旋轉(zhuǎn) scale 縮放 skew 斜切 兼容性 ie6-8 不兼容
    查看全部

舉報

0/150
提交
取消
課程須知
1、您要具備HTML和CSS基礎(chǔ)知識 2、了解CSS3中的動畫。
老師告訴你能學(xué)到什么?
1,學(xué)會兩個HTML5新標(biāo)簽figure以及figcaption 2,學(xué)會使用CSS的transform 3,學(xué)會使用CSS3的transition 4,學(xué)會利用屬性配合制作出絢麗的動畫效果

微信掃碼,參與3人拼團

微信客服

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

幫助反饋 APP下載

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

公眾號

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

友情提示:

您好,此課程屬于遷移課程,您已購買該課程,無需重復(fù)購買,感謝您對慕課網(wǎng)的支持!