整理 | 屠敏
出品 | CSDN(ID:CSDNnews)
在大多数人的认知里,CSS 只是用来美化网页的样式表语言,和编程、运算关系不大,甚至不少程序员们还常拿“CSS 算不算编程语言”当作玩笑。
不过近日,一位名为 Lyra Rebane 的开发者坐实了「CSS 就是一门编程语言」的说法,她仅凭纯 CSS 写出了一个 x86 CPU 模拟器,全程没有使用一行 JavaScript、WASM 代码,让原本只负责网页样式的 CSS,真正实现了“计算”的功能。
这个看似“离经叛道”的项目,也让人们重新审视 CSS 的能力边界。
试玩地址:https://lyra.horse/x86css/
一个纯 CSS 打造的 x86 CPU 模拟器,能跑 C 程序还带交互
据 Lyra Rebane 介绍,她开发的这个项目名为 x86css(https://lyra.horse/x86css/),本质上是一个基于 CSS 实现的 16 位 x86 CPU 模拟器。
简单来说,就是用网页样式语言在浏览器里造了一台“迷你电脑”。这台“CSS 电脑”并非花架子,而是具备了实际的运算和交互能力,甚至能像真实的 CPU 一样执行机器代码。
基于此,她建了一个网页,展示一个用 C 语言编写的程序,经过 GCC 编译成原生的 8086 机器码后,完全在 CSS 中执行的过程。
从功能来看,x86css 配备了一个基础的显示界面和虚拟键盘,还预装了一些程序,比如用于计算斐波那契数列、生成 Pascal 三角形,甚至还有一个类 Wordle 的文字游戏,这些程序都能在纯 CSS 环境下独立运行。
更令人惊讶的是,它并非只能运行开发者预设的程序,普通开发者也能自己编写 C 语言代码,通过专用编译器编译后,在这个 CSS 模拟器上执行。
很多人看到这个项目的第一反应是:“它能跑 Doom 吗?”这是游戏和编程圈的经典问题,也是对模拟器性能的终极考验。
答案是暂时不能,原因并非 CSS 性能不足,而是这个模拟器目前仅实现了 16 位 x86(8086)架构的核心功能,缺少中断处理、端口输入输出等游戏必备的关键特性,而 Doom 作为 32 位程序,还需要 32 位 CPU、4MB 内存和保护模式支持,这些都是当前版本的 x86css 尚未实现的。
但即便如此,能让 CSS 实现 CPU 的核心运算功能,已经是前所未有的突破。
不用 JS、不依赖 AI 大模型,CSS 如何实现“计算”?
在普通人看来,CSS 只是用来设置字体、颜色、布局的工具,怎么可能实现 CPU 的运算逻辑?
Lyra Rebane 的操作,全靠把现代 CSS 的新特性玩到了极致,而且全程手搓代码。
首先明确一点,这个 x86 CPU 是纯 CSS 驱动的,并没有借助 JavaScript 或 WebAssembly。
对此,有人发现 Lyra Rebane 分享的网站里包含了
热门跟贴