Skip to main content

純 CSS 實現 8086 CPU 模擬器

Lyra Rebane

簡介​

Lyra Rebane 以零 JavaScript、僅用 HTML + CSS 實作了一台 x86（8086）CPU 模擬器。使用者可以用 C 語言撰寫程式、編譯成 x86 機器碼，再放進這個「CSS CPU」裡執行。

  • 不需任何 JS 或腳本
  • 即使瀏覽器停用網站腳本，模擬器仍可僅靠 CSS 運作
  • 可視為「純 CSS 程式」的極端示範

技術要點​

  • CSS 不是程式語言，但 Rebane 利用一項特性：CSS 循環變數（如 @property / 動畫或計數器）不會自動失效，搭配約 5 種可觀測的變量數值 來模擬 CPU 行為。
  • 做法可說是「腦洞大開、前無古人」，把樣式表當成運算與狀態機使用。

作者觀點​

  • 她表示未使用任何 AI 協助或提供靈感，並認為 AI 多半不會想到「用 CSS 做 8086 模擬器」這種方向。
  • 她補充：「其實直接用 CSS 當作程式本身可以獲得更好效能，但用 CSS 去模擬一顆古老的 CPU 會更有趣。電腦本來就是藝術同娛樂而生。」

連結​