3D Book Image CSS Generator – 免費線上建立 3D 書本展示效果，可設定圖片與連結並產生 CSS 與 HTML 程式碼

3D Book Image CSS Generator 是一個非常有趣的免費線上工具，他能夠幫你產生一個 3D 立體動態的書本效果，非常適用於展示書籍時使用，讓你能夠上傳自己的書本圖片進行製作。

3D Book Image CSS Generator 除了能夠上傳客製化圖片產生 3D 書本效果之外，還能夠為圖片添加圖片 Alt 與圖片連結…等等細節，還能添加書本的底色、旋轉角度、滑鼠經過時的旋轉角度、透視像素、動畫持續時間、書邊圓角、書本厚度、書本長寬與頁面偏移量…等等功能，調整的過程中，你就能立即看到 3D 書本呈現的效果。

網站名稱：3D Book Image CSS Generator
網站網址：https://3d-book-css.netlify.app/

3D Book Image CSS Generator 簡介教學

Step 1

進入頁面之後，右邊就會顯示預設的圖片以及預設的設定，你就能看到實際的 3D 書本效果：

Pin

你可以在「Image URL」欄位中填入你想要顯示書本封面的網址，右側的展示圖就會立即更換，同時你還能在下方填入「Image Alt」與「Image link」來給予圖片 Alt 敘述以及超連結。

下方的各項功能就是調整 3D 書本的顯示效果了，你可以自行調整想要的 3D 顯示效果。如果覺得調整失敗或是不喜歡，則可以點選「Reset with Defaults」將其還原成原本預設的設定。

Step 2

調整完成後，下方就會自動產生相對應的 CSS 與 HTML 程式碼，你只要複製到網站當中，就能顯示 3D 書本的效果：

Pin

因此，貼至網站中顯示後，就會呈現以下效果畫面：

Pin

以上就是「3D Book Image CSS Generator – 免費線上建立 3D 書本展示效果，產生 CSS 與 HTML 程式碼」的完整介紹內容，如果喜歡的話，請幫忙點讚並分享，謝謝！