思路：用::befor偽元素生成用於3d翻轉的字型
實現起來挺簡單的：
新建5個div，每個div分別對應5個字型
用::befor生成用於翻轉的字型，並用absolute，以及z-index控制生成字型的位置
當元素被:hover時，就進行3d翻轉
實現起來挺簡單的，下面直接上原始碼：
前端小
學生
上面這兩個屬性呢，是可以和::before和::afterwwe偽元素搭配使用的，效果極佳
靈感來自於這個部落格：但我的實現方式和他不同
css 3d 動畫 相關
transform style preserve 3d 設定3d模式perspective 700px 屬性定義 3d 元素距檢視的距離，以畫素計。該屬性允許您改變 3d 元素檢視 3d 元素的檢視。當為元素定義 perspective 屬性時，其子元素會獲得透視效果，而不是元素本身perspect...
css 3d 動畫相關總結
傾斜 transform skew 水平傾斜 transform skew 水平,垂直 transform skewx transform skewy target 選擇器可用於選取當前活動的目標元素。css樣式 圓角 border radius 元素是正方形 寬度的一半px 50 正圓 元素是長方...
CSS 3D動畫筆記
3d 在2d的基礎上新增 z 軸的變化 3d 位移 在2d的基礎上新增 translatez 或者使用translate3d translatez 以方框中心為原點，變大 3d 縮放 在2d的基礎上新增 scalez 或者使用scale3d scalez 和 scale3d 函式單獨使用時沒有任何效...