特效展示中心

探索並體驗各種炫酷的網頁特效。點擊卡片即可預覽。

特效

特效/遊戲

舊式頁面轉場特效實驗室

探索這些曾用於 Internet Explorer 的頁面轉場特效。選擇一個特效以查看其 meta 標籤，並可嘗試在下方 iframe 中預覽。

重要提醒

以下展示的 <meta http-equiv="Page-Enter" ...> 及 <meta http-equiv="Page-Exit" ...> 轉場特效是 **早期 Internet Explorer 的專有功能**。在現今主流的瀏覽器（如 Chrome、Firefox、Safari、Edge）中，這些特效 **已不再被支援，因此您極可能無法看到任何視覺轉場效果**。此工具主要目的是展示這些舊式標籤的語法結構，並讓您了解網頁技術的演進。

選擇一個特效：

Meta 標籤語法：

<meta http-equiv="Page-Enter" content="blendTrans(Duration=3.2)" />

整個頁面淡入。

預覽視窗 (嘗試套用)：

選擇一個特效並點擊「嘗試套用此特效」按鈕，

以在此處的 iframe 中載入一個套用了該 meta 標籤的簡單頁面。

(請注意，效果在現代瀏覽器中可能不顯示)

現代 CSS 動畫效果展示

探索一些常見的現代 CSS 動畫效果。選擇一個效果，然後點擊按鈕在下方預覽。

預覽提示

這些動畫是使用 CSS Keyframes 實現的。您可以查看本站的 `globals.css` 檔案來了解它們的具體定義。點擊按鈕後，下方的方塊會套用所選動畫。

選擇一個 CSS 動畫效果：

動畫說明：

元素從透明逐漸變為不透明。

套用的 CSS 類別：

.animate-fade-in

預覽區域：

動畫元素