CSS在我所知的范围内并不是图灵完备的。但是我对CSS的了解非常有限。
CSS是图灵完备的吗？
CSS是图灵完备的吗？
CSS是图灵完备的吗？
386
- Adam Davis
6
40如果您使用ie6，已经可以完成这个任务。它们被称为CSS表达式，共识是它们非常容易出错并且存在风险。在CSS中嵌入JS... - kibibu
19@Kibibu - 哎呀！在我的大脑将其折叠之前，请从我的思维中删除那个想法！ - DVK
CSS怎么可能是图灵完备的？ - SLaks
1@DVK：你实际上可以用它们做一些很酷的事情，特别是关于分辨率无关布局方面，这在没有使用表格的情况下仍然很棘手或古怪。我认为，如果他们将其限制为严格的声明性表达语言而没有允许完全访问脚本引擎，那么它会更受欢迎（也许如果Webkit首先提出它也是如此）。 - kibibu
10不要低估HTML5/CSS3的威力 :) - Niklas B.
在XYZZY中嵌入一个非图灵完备的语言，却使得XYZZY变成了图灵完备的... 这个逻辑有点不对劲。 - Jürgen A. Erhard
8个回答
470
你可以在CSS3中编码Rule 110，只要你认为适当的HTML文件和用户交互是CSS“执行”的一部分，它就是图灵完备的。有一个相当不错的实现可用，并且另一个实现包含在此处：
body {
-webkit-animation: bugfix infinite 1s;
margin: 0.5em 1em;
}
@-webkit-keyframes bugfix { from { padding: 0; } to { padding: 0; } }
/*
* 111 110 101 100 011 010 001 000
* 0 1 1 0 1 1 1 0
*/
body > input {
-webkit-appearance: none;
display: block;
float: left;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
padding: 0px 3px;
margin: 0;
font-family: Consolas, "Courier New", monospace;
font-size: 7pt;
}
body > input::before {
content: "0";
}
p {
font-family: Verdana, sans-serif;
font-size: 9pt;
margin-bottom: 0.5em;
}
body > input:nth-of-type(-n+30) { border-top: 1px solid #ddd; }
body > input:nth-of-type(30n+1) { border-left: 1px solid #ddd; clear: left; }
body > input::before { content: "0"; }
body > input:checked::before { content: "1"; }
body > input:checked { background: #afa !important; }
input:not(:checked) +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input::before {
content: "1";
}
input:not(:checked) +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input {
background: #fa0;
}
input:checked +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input::before {
content: "1";
}
input:checked +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input {
background: #fa0;
}
input:checked +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input::before {
content: "1";
}
input:checked +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input {
background: #fa0;
}
input:checked + input:checked + input:checked +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input::before {
content: "0";
}
input:checked + input:checked + input:checked +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input {
background: #fff;
}
input:not(:checked) + input:not(:checked) + input:not(:checked) +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input::before {
content: "0";
}
input:not(:checked) + input:not(:checked) + input:not(:checked) +
*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+
input {
background: #fff;
}
body > input:nth-child(30n) { display: none !important; }
body > input:nth-child(30n) + label { display: none !important; }<p><a href="http://en.wikipedia.org/wiki/Rule_110">Rule 110</a> in (webkit) CSS, proving Turing-completeness.</p>
<!-- A total of 900 checkboxes required -->
<input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/>- Jakob
13
14图灵机的最简形式定义仅由状态集、符号集、初始状态、接受状态集和转移函数组成，其中没有曲柄。计算意味着有人需要忠实地在纸带上应用转移函数，这恰好类似于转动曲柄。更正式地说，计算模型可以被视为一组规则，某人需要遵循这些规则来进行计算。从这个意义上讲，我认为CSS是图灵完备的。 - Shuhao Tan
3这段代码在Firefox 61上似乎无法正常工作。我看到了一排空白复选框，如果你勾选它们也没有任何反应。 - OrangeDog
10“CSS是图灵完备的”这个说法让我感到有点不安，但是“CSS与海滩上的几块石头一样图灵完备”我就没有问题了。后面这个说法正确吗？ - Raphael Schmitz
8@R.Schmitz 不是这样的，那种情况下是人选择放石头的位置，因此人类+石头的系统是图灵完备的。在上面的CSS示例中，tab + space键的按键是一个简单的重复过程，类似于反馈电路。因此，如果C++使用计算机硬件执行指令是图灵完备的，那么可以说CSS使用重复按键执行指令也是图灵完备的。 - woojoo666
5说CSS是图灵完备的，只要你认为适当的HTML文件和用户交互是CSS“执行”的一部分，这听起来更像是“只要你认为它意味着可以显示红色边框，它就是图灵完备的”。 - Andrea Lazzarotto
显示剩余8条评论
117
Turing完备性的一个方面是停机问题。
这意味着，如果CSS是Turing完备的，那么就没有一种通用算法可以确定CSS程序是否会完成运行或永远循环。
但我们可以为CSS推导出这样的算法！它在这里：
如果样式表没有声明任何动画, 那么它将停止。
如果它有动画，则：
如果任何
animation-iteration-count是无限，并且包含选择器在HTML中匹配，则它将不会停止。否则，它将停止。
Daniel Wagner提出了一个我在原答案中忽略的观点。他指出，虽然我涵盖了动画，但样式引擎的其他部分，如选择器匹配或布局，也可能导致图灵完备性。虽然很难对这些进行正式的论证，但我会尝试概述为什么图灵完备性仍然不太可能发生。
首先：图灵完备语言有一些将数据“反馈”到自身的方式，无论是通过递归还是循环。但是CSS语言的设计对这种反馈是敌对的。
@media查询只能检查浏览器本身的属性，例如视口大小或像素分辨率。这些属性可以通过用户交互或JavaScript代码（例如调整浏览器窗口大小）而更改，但不能仅通过CSS更改。::before和::after伪元素不被视为DOM的一部分，也不能以任何其他方式匹配。选择器组合器只能检查当前元素之前和之上的元素，因此不能用于创建依赖循环。
可以在悬停时将元素移开, 但位置只有在移动鼠标时才会更新。
现代CSS布局算法非常复杂，具有Flexbox和Grid等功能，这使得情况变得更加混乱。但即使可能通过布局触发无限循环，也很难利用它来执行有用的计算。这是因为CSS选择器仅检查DOM的内部结构，而不检查这些元素在屏幕上的布局方式。因此，任何使用布局系统证明图灵完备性的证明必须仅依赖于布局本身。
最后，这可能是最重要的原因 - 浏览器供应商有兴趣保持CSS不是图灵完备的。通过限制语言，供应商可以实现巧妙的优化，使网络对每个人都更快。此外，谷歌专门为在Chrome中搜索错误而献身于整个服务器农场。如果有一种使用CSS编写无限循环的方法，那么他们可能已经找到了它。
- Lambda Fairy
14
8当人们说“CSS是图灵完备的”时，他们的意思是“支持动画效果的CSS是图灵完备的”。您可以根据逻辑限制编程语言并得出它们不是图灵完备的结论，但您必须指定这些限制。 - felipecrv
53我认为这个答案使用了一个有趣的“halt”（停止）定义——至少不是我在提问时想要的定义。您似乎使用“halt”来表示“每个元素的计算属性停止改变的时间”，但是我想让“halt”表示“将声明性CSS转换为所有元素的计算属性的算法完成运行”。以后者的定义来看，似乎需要更多的论证，而不仅仅是“没有动画”。 - Daniel Wagner
20你的逻辑是错误的。图灵完备性意味着停机问题是不可判定的，并不意味着停机问题不可判定就一定具备图灵完备性。 - asmeurer
5@LambdaFairy 什么是 CSS 的停机问题？我不认为这样的问题存在。停机问题只与机器相关。我们今天拥有的最强大的计算模型是图灵机。您的计算机的能力与图灵机相当（没有无限内存）。单独的 CSS 不能被定义为一台机器。也许您可以将浏览器的 CSS 引擎定义为一台机器，但即使这样它也只能和图灵机一样强大。除非 CSS 已经成为 Chomsky 层次结构中的新自动机，否则“CSS 的停机问题”这个说法根本就没有意义。 - Mike Shi
8@LambdaFairy 你误解了证明图灵不完备性的方式。我们知道由于图灵机无法判定停机问题是不可判定的。最初的证明似乎是在声称，因为CSS可以解决停机问题，所以它不是图灵完备的。如果CSS真的可以解决停机问题，那么CSS就比图灵机更强大，因为它可以计算图灵机无法计算的东西。根据（Church-Turing Thesis）的理论，我们知道不能建造一台比图灵机/λ演算更强大的机器。因此，这是一个矛盾，你最初的陈述是不正确的。 - Isaac Diamond
显示剩余9条评论
33
根据本文，它不是这样的。文章还指出将其变成一个好主意。
引用其中一条评论：
所以，我不相信CSS是图灵完备的。没有定义CSS函数的能力。为了使系统图灵完备，必须有编写解释器的可能：一种解释表示要执行的程序的表达式的功能。CSS没有直接可访问的变量；因此，您甚至无法在CSS中模拟表示要解释的程序的结构。
- DVK
6
4CSS 无法以任何方式执行。引用评论的人似乎没有理解这一点。 :-\ - Ryan Prior
42CSS 是一组针对处理器（布局引擎）的指令。为什么它被认为是“不可执行”的呢？ - DVK
64图灵完备性不仅仅是关于你是否可以按照自己的意愿编写程序或一种信仰，它是关于可计算性的数学属性。因此，你不能相信或不相信CSS是图灵完备的，你需要有一个证明。在这种情况下，由于规则110的存在，CSS是图灵完备的。 - Mikaël Mayer
17正如“110”答案中的许多评论所指出的，它需要用户执行操作。如果需要用户操作，则没有用户的CSS是不完备的。 - DVK
9CSS 110示例所需的重复按键并不完全是用户“操作”，它们可以由重复数字电路执行。实际的图灵机需要某种电气硬件来驱动执行，因此我认为这没有什么不同之处。 - woojoo666
6
这个答案不准确，因为它混淆了UTM的描述和UTM本身（通用图灵机）。
我们有好的答案，但是从不同的角度，它并没有直接显示当前最佳答案中的缺陷。
首先我们可以认同人类可以作为通用图灵机（UTM）运作。这意味着如果我们...
CSS + Human == UTM
那么 CSS 部分是无用的，因为所有的工作都可以由执行 UTM 部分的人类完成。点击行为可以成为 UTM，因为您不是随意点击，而是在特定位置点击。
我可以使用这段文字（规则110）代替 CSS：
000 -> 0
001 -> 1
010 -> 1
011 -> 1
100 -> 0
101 -> 1
110 -> 1
111 -> 0
为了指导我的行动和结果将是相同的。这意味着这段文本是UTM吗？不，这只是其他UTM（人类或计算机）可以阅读和运行的输入（描述）。点击就足以运行任何UTM。
CSS缺乏的关键部分是任意改变自身状态的能力，如果CSS能够生成点击事件，那么它就是UTM。认为CSS的点击事件是“扭曲”的观点并不准确，因为真正的“扭曲”来自运行CSS的布局引擎，这应该足以证明CSS是UTM。
- Yankes
31
2@CedricMamo 但是你的点击会改变状态，你只需要在正确的位置点击，否则它将无法工作。请仔细查看http://eli.fox-epste.in/rule110-full.html 我可以点击任何单元格，如果禁用CSS，我仍然可以点击正确的单元格并获得UTM。如果您所做的一切都是点击一个按钮“下一个”，那么确实CSS将是UTM，但要拥有像这样的东西，您需要有一些JS，每次按钮点击时调用，而我们知道JS是UTM。对于CSS，您需要有一些能够正确解释结果并更新状态的东西。 - Yankes
1@CedricMamo 有相关链接吗？我现在正在查看那里的一些示例，但对我来说不起作用。总体而言，如果我理解正确，CSS更改某些复选框的可见性，并且您使用选项卡导航到下一个选项，这里我们再次隐藏了不是CSS的UTM，因为当您切换时，您要求浏览器计算下一个有效位置以进行导航，并且要做很多复杂的代码，这使用CSS，但它更多。这意味着您证明了您的浏览器是UTM而不是CSS。 - Yankes
1在 CPU 中，当一条指令结束时，它会保留自身的状态，以便当时钟再次上升时，电子流动并且正确的晶体管恰好以正确的组合切换。实际上，使计算发生的不是 CPU（计算模型），而是物理学！如果电子没有按照这个路径而是按照其他路径流动，CPU 就无法为下一步设置好条件。浏览器是 CSS 运行的硬件。我不知道问题出在哪里。CSS 设置了一个状态，根据其所处的“物理学”世界，导致下一个状态的产生。 - Cedric Mamo
1不，它们并没有。它们定义了状态转换，仅此而已。这就足以使其成为通用图灵机。它不规定应该如何完成，无论你是在计算机上还是在纸张上去执行这些规则，只要你严格依照这些规则操作，你就能够计算任何问题。在CSS中，你可以定义这些完全相同的状态转换。无论它们如何存储，如何访问，谁来运行时钟都没有关系。重要的是，CSS允许规定这些规则。这就是使其成为通用图灵机的原因。其他任何东西都只是你自己添加的额外标准。 - Cedric Mamo
1你可以通过设置细胞来定义初始状态。CSS指定了转换方式，将当前一代转变为下一代。在自动机中，它并不定义如何推进t。事实上，元胞自动机无法推进t。无论是程序还是手工计算下一代，应用规则到这一代，都使得过程图灵完备。推进t意味着从当前一代计算出下一代。CSS正是做到了这一点。如何推进t？随便你怎么想就怎么做吧。因为t+1只是数学上表示“下一代”的一种方式，而不是真正的时间。 - Cedric Mamo
显示剩余26条评论
6
这里的根本问题是，任何用HTML+CSS编写的机器都无法在无限地步数下进行评估（也就是说，没有“真正”的递归），除非代码是无限长的。如果
n是有限的，那么这个机器能否在不超过n步的情况下到达配置H的答案总是可以回答的。- Henrik Sommerland
24
2我没有看到图灵机要求处理无限循环的能力。你的第二点似乎是无效的。虽然图灵使用他的图灵机来证明可计算性问题，但这些规则（如停机问题）并不确定一台机器是否是图灵机。如果图灵机将这些假设作为要求，他就不能使用图灵机来证明它们。 - Adam Davis
6这是一个完全有效的论点：如果存在一个算法可以解决图灵完备形式化语言的停机问题，那么这等价于解决一般的停机问题。当然，已经被证明这是不可能的，这意味着如果停机问题可以针对某个形式化语言得到解决，那么该形式化语言必须不是图灵完备的。因此，所有只能计算有限步的形式化语言都不能是图灵完备的，包括CSS在内。 - 00dani
2@AdamDavis 如果CSS无法表达无限循环，那么它对停机问题的回答就是微不足道的——程序将始终停止。由于所有图灵完备语言都有一个不可判定的停机问题，这就排除了CSS是图灵完备的可能性。 - Lambda Fairy
4不是如果B就A！而是如果不B就不A！前者会犯肯定后件谬误，你正确地指出了这一点。后者，即反证法，是我使用的方法，并且是有效的。请注意我上一个评论中仔细使用了否定——我特意构造了它以避免那种谬误。 - Lambda Fairy
2@woojoo666 不行。能够根据一组规则转换状态并不等同于图灵完备。任何只能进行有限步骤的东西都不能是图灵完备的。如果变换规则集只能应用有限次，那么“系统是否会达到状态
H？”这个问题总是可以确定的，因此它不是图灵完备的。一个只能进行有限次迭代的元胞自动机实现永远不能是图灵完备的。 - Henrik Sommerland显示剩余19条评论
5
图灵完备性不仅仅是“定义函数”或“有if/loop等”。例如，Haskell没有“loop”， λ演算没有“if”等等...
例如，这个网站：http://experthuman.com/programming-with-nothing。作者使用Ruby并只使用闭包（没有字符串、数字或类似的东西）创建了一个“FizzBuzz”程序...
有些人使用Scala的类型系统计算一些算术函数。
因此，是的，我认为CSS3+HTML是图灵完备的（即使您不能严格意义上使用它们进行任何真正的计算，否则会变得疯狂）。
例如，这个网站：http://experthuman.com/programming-with-nothing。作者使用Ruby并只使用闭包（没有字符串、数字或类似的东西）创建了一个“FizzBuzz”程序...
有些人使用Scala的类型系统计算一些算术函数。
因此，是的，我认为CSS3+HTML是图灵完备的（即使您不能严格意义上使用它们进行任何真正的计算，否则会变得疯狂）。
- Maurício Szabo
16
14Haskell和lambda演算具有递归功能。CSS有吗？在Malbolge中进行任何实际计算需要疯狂，但在CSS中，无论你有多疯狂，它都不会起作用。CSS不是图灵完备的，这不是一种观点问题。 - JMCF125
12很抱歉，我在这个页面上没有找到你的其他评论。但是如已接受答案所注明的那样，它是图灵完备的“（...）只要您认为（...）用户交互是CSS“执行”的一部分”。 而我并不这么认为。 - JMCF125
29没有恶意地说，图灵完备性不会因任何人的观点而改变。 - trisweb
5不，CSS3加HTML加上“一个不断模拟的人”可以构成图灵完备。 - Lambda Fairy
7@LambdaFairy 这也适用于每个物理图灵机。 - Miles Rout
显示剩余11条评论
1
CSS是图灵完备的，而且在程序执行期间不需要任何用户交互。
在CSS中，可以评估任意有限布尔电路和图灵机，前提是有一个静止的鼠标光标来触发:hover规则。我不知道对于没有光标的设备是否有等效的机制。 注意：这些示例是我自己开发的。据我所知，这是第一个使用纯CSS编写的可运行的图灵机。
在CSS中，可以评估任意有限布尔电路和图灵机，前提是有一个静止的鼠标光标来触发:hover规则。我不知道对于没有光标的设备是否有等效的机制。 注意：这些示例是我自己开发的。据我所知，这是第一个使用纯CSS编写的可运行的图灵机。
- Clement Cherlin
-39
CSS不是一种编程语言，因此图灵完备性的问题毫无意义。如果像IE6中那样向CSS添加了编程扩展，那么这个新的综合就是完全不同的东西。
CSS仅仅是样式的描述，它没有任何逻辑，并且其结构是平面的。
- Ryan Prior
4
1另外（如果我没记错的话），当使用多个冲突（重复）的样式时，有一些关于哪种样式优先的歧义。而且不同浏览器实现/解释标记样式的方式也略有不同。 - David R Tribble
82“CSS不是一种编程语言，因此图灵完备性的问题是没有意义的。” 该句话是自我重述的。 - Adam Davis
8如果你想知道为什么你的回答被踩得这么厉害，不妨看一下编程语言Prolog。 - edwin
CSS也是有逻辑的。我非常确定在2010年左右，CSS也有一些基本的逻辑，比如使用css calc()函数。 - undefined
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接