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

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

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

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

3、最后打開瀏覽器，就會看到一個圖片：

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