css3的圖形3d翻轉(zhuǎn)效果應(yīng)用示例？1、首先打開(kāi)html文件編輯器，這里使用vscode新建一個(gè)html文檔，文檔中寫(xiě)入基本的html結(jié)構(gòu)，然后插入img標(biāo)簽并插入一張圖片，給img一個(gè)class屬性

css3的圖形3d翻轉(zhuǎn)效果應(yīng)用示例？

1、首先打開(kāi)html文件編輯器，這里使用vscode新建一個(gè)html文檔，文檔中寫(xiě)入基本的html結(jié)構(gòu)，然后插入img標(biāo)簽并插入一張圖片，給img一個(gè)class屬性：

2、然后在上方的head標(biāo)簽中的style標(biāo)簽設(shè)置樣式，這里設(shè)置圖片的寬度和高度并設(shè)置相對(duì)定位，然后設(shè)置圖片的鼠標(biāo)懸浮樣式，其中設(shè)置動(dòng)畫(huà)的形式為3d以及設(shè)置圖片3d旋轉(zhuǎn)偏移的角度，添加一個(gè)動(dòng)畫(huà)，設(shè)置好延時(shí)即可：

3、最后打開(kāi)瀏覽器，就會(huì)看到一個(gè)圖片：

4、當(dāng)鼠標(biāo)移動(dòng)上去，圖片就會(huì)自動(dòng)3d旋轉(zhuǎn)了：