那些遇到过的问题

CSS图灵完成了吗？

Ada*_*vis 284 css turing-complete

据我所知,CSS不是图灵完整的.但我对CSS的了解非常有限.

  • CSS图灵完成了吗？
  • 现有的草案或委员会是否考虑过可能使图灵完整的语言特征,如果现在不是这样的话？

Jak*_*kob 374

您可以在CSS3中对规则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; }
Run Code Online (Sandbox Code Playgroud) 
<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"/>
Run Code Online (Sandbox Code Playgroud)

  • 说“[CSS] 是图灵完备的，只要您认为适当的随附 HTML 文件和用户交互是 CSS“执行”的一部分”_或多或少听起来像 _“它是图灵完备的，只要你认为它意味着它可以显示红色边框”._ (5认同)
  • @R.Schmitz 不，在这种情况下，人类正在选择放置岩石的位置，因此图灵完整的是人类+岩石的组合系统。在上面的 CSS 示例中，tab+space 按键是一个简单的重复过程，类似于反馈电路。因此，如果 C++ 使用计算机硬件来执行指令来完成图灵，那么说 CSS 使用重复按键来执行指令来完成图灵并不是一件容易的事 (4认同)
  • 图灵机的形式定义(最简单)只是状态集,符号集,初始状态,接受状态集和转换函数的元组.里面没有曲柄.通过计算我们的意思是有人需要忠实地在磁带上应用转换功能,这与本例中的点击完全相同.更正式地说,计算模型可以被视为一组有人需要遵循的规则来进行计算.从这个意义上讲,我认为CSS是Turing-Complete. (2认同)
  • 此代码段似乎不起作用(Firefox 61).我看到一个空的复选框网格 - 如果你检查它们没有任何反应. (2认同)
  • @John“ CSS巡演已经完成”使我感到不安，但是“ CSS的巡演已经和[海滩上的几块石头一样]（https://xkcd.com/505/）”没问题。后一种说法正确吗？ (2认同)
  • 不幸的是，这个得票最高的答案并不准确。所有实现都是CSS仅编码规则110（或任何其他算法）的*一步*。他们无法推进下一步计算，而下一步计算是图灵完备性的重要组成部分。 (2认同)

Lam*_*iry 85

图灵完整性的一个方面是它的停顿问题是不可判定的.

这意味着没有通用算法来确定CSS程序是完成运行还是永远循环.

但我们可以为CSS推导出这样的算法!这里是:

  • 如果样式表没有声明任何动画,那么它将停止.

  • 如果它确实有动画,那么:

而已.由于我们只是表明停止问题对于CSS是可判定的,因此CSS 不是图灵完整的.

(其他人提到了IE 6,它允许在CSS中嵌入任意JavaScript表达式;这显然会增加图灵的完整性.但是这个功能是非标准的,无论如何,没有人在正确的思想中使用它.)

Daniel Wagner提出了我在原始答案中遗漏的一点.他指出,虽然我已经介绍了动画,但是样式引擎的其他部分(例如选择器匹配或布局)也可以导致图灵的完整性.虽然很难对这些做出正式的论证,但我会试着概述为什么图灵完整性仍然不太可能发生.

第一:图灵完整语言有一些方法可以将数据反馈回自身,无论是通过递归还是循环.但是CSS语言的设计对这种反馈很不利:

  • @media查询只能检查浏览器本身的属性,例如视口大小或像素分辨率.这些属性可以通过用户交互或JavaScript代码(例如调整浏览器窗口大小)进行更改,但不能仅通过CSS进行更改.

  • ::before和::after伪元素不被视为DOM的一部分,并且不能以任何其他方式匹配.

  • 选择器组合器只能检查当前元素之上和之前的元素,因此它们不能用于创建依赖循环.

  • 当您将鼠标悬停在其上时,可以将元素移开,但只有在移动鼠标时才会更新位置.

这应该足以说服你,选择器匹配本身不能完全图灵.但布局怎么样？

现代CSS布局算法非常复杂,Flexbox和Grid等功能使得水域变得混乱.但即使有可能触发布局的无限循环,也很难利用它来执行有用的计算.那是因为CSS选择器只检查DOM的内部结构,而不是如何在屏幕上布局这些元素.因此,使用布局系统的任何图灵完整性证明必须仅依赖于布局.

最后 - 这可能是最重要的原因 - 浏览器供应商有兴趣保持CSS 不是图灵完整.通过限制语言,供应商可以进行巧妙的优化,使每个人的网络更快.此外,Google将整个服务器场专门用于搜索Chrome中的错误.如果有一种方法可以使用CSS编写无限循环,那么他们可能已经找到了它

  • 我认为这个答案正在使用一个有趣的"停止"定义 - 当然,如果我问这个问题,那肯定不是我想要的那个,至少.您似乎使用"暂停"来表示"每个元素的计算属性都有一段时间停止变化"; 但我希望"停止"的意思是"将声明性CSS转换为所有元素运行的计算属性的算法".根据后一种定义,似乎需要的论证要多于"没有动画". (34认同)
  • @asmeurer答案使用[modus tollens](https://en.m.wikipedia.org/wiki/Modus_tollens),这是一种有效的论证形式.图灵完全意味着不可判断,错误,可判定意味着没有图灵完整.问题的说明可能存在问题(如丹尼尔所说),但逻辑本身是合理的. (13认同)
  • 你的逻辑在这里是倒退的.图灵完整性意味着停止是不可判定的并不意味着停止是不可判定的意味着图灵的完整性. (4认同)
  • 当人们说"CSS is turing complete"时,他们的意思是"支持动画的CSS是Turing Complete".您可以使用您的逻辑来限制编程语言并得出结论它们不是Turing Complete,但您必须指定限制. (3认同)
  • @LambdaFairy CSS*的暂停问题是什么？我不相信这样的事情存在.暂停问题仅与机器有关.我们今天拥有的最强大的计算模型是图灵机.您的计算机与图灵机一样强大(没有无限内存).仅CSS不能被定义为机器.也许您可以将浏览器的CSS引擎定义为机器,但即便如此,它也只能像TM一样强大.除非CSS已成为乔姆斯基层次结构中的新自动机,否则语句"暂停问题*for CSS*"只是没有任何意义. (3认同)
  • @LambdaFairy你误解了图灵不完整的证据是什么样的.我们知道暂停问题是由TM无法判断的.原始证据似乎提出了主张,因为CSS可以解决它没有完成的暂停问题.如果CSS可以真正解决暂停问题,那么CSS比图灵机更强大,因为它可以计算TM无法计算的东西.我们知道(通过Church-Turing论文),机器不能建立比TM/The Lambda微积分更强大的机器.因此,这是一个矛盾,你原来的陈述是不正确的. (3认同)
  • -1'd.这不是一个恰当的证明,并且错误地解释了为TM(图灵机)提供完整图案和一系列不可判定问题的想法.*如果机器可以解决暂停问题(确定机器是否会停止),那么它将比TM更强大*,因此也能够解决TM可以解决的任何问题.即使证明是正确的,你也证明了不仅CSS图灵完整,而且它比图灵机更强大(这不是真的).我建议用免责声明进行编辑,以免误导任何计算理论学生. (2认同)

DVK*_*DVK 30

根据这篇文章,它不是.文章还认为,制作一个并不是一个好主意.

引用其中一条评论:

所以,我不相信CSS是完整的.没有能力在CSS中定义函数.为了使系统能够完成,必须能够编写一个解释器:一个解释表达程序来执行的函数.CSS没有可供用户直接访问的变量; 所以你甚至无法模拟表示要在CSS中解释的程序的结构.

  • 如果你能以你想要的方式或信仰来编写程序,图灵完整性不仅仅是关于.它是关于可计算性的数学特性.所以你不能相信CSS是图灵完整的,你需要一个证明.在这种情况下,由于规则110,CSS是图灵完备的. (45认同)
  • CSS是处理器(布局引擎)的一组指令.什么不是"可执行"的呢？ (32认同)
  • @MikaëlMayer - 正如"110"答案中的许多评论所述,需要用户执行操作.如果需要用户操作,则没有用户的CSS不是图灵完成 (15认同)
  • @DVK CSS 110 示例所需的重复按键并不是用户“动作”，它们可以由重复数字电路执行。实际的图灵机需要某种电子硬件来驱动执行，所以我看不出这有什么不同 (4认同)
  • CSS不以任何方式执行.撰写引用评论的人似乎并不理解.: - \ (3认同)

Yan*_*kes 7

这个答案是不准确的，因为它混合了UTM和UTM本身（通用图灵机）的描述。

我们有很好的答案，但从不同的角度来看，它并没有直接显示出当前最佳答案的缺陷。

首先我们同意人类可以充当UTM。这意味着如果我们这样做

CSS + Human == UTM
Run Code Online (Sandbox Code Playgroud)

那么这部分就没用了，因为所有的工作都可以由做 UTM 部分的人CSS来完成。Human点击行为可以是UTM，因为你不是随机点击的，而是只在特定的地方点击。

我可以使用以下文本（规则 110 ）来代替 CSS ：

000 -> 0
001 -> 1
010 -> 1
011 -> 1
100 -> 0
101 -> 1
110 -> 1
111 -> 0
Run Code Online (Sandbox Code Playgroud)

指导我的行动和结果将是相同的。这意味着这段文字UTM？不，这只是其他 UTM（人或计算机）可以读取和运行的输入（描述）。单击足以运行任何 UTM。

CSS 缺乏的关键部分是能够以任意方式更改其自身状态，如果 CSS 可以生成点击，那么它就是 UTM。关于 CSS 的点击是“曲柄”的说法并不准确，因为 CSS 的真正“曲柄”是运行它的布局引擎，这应该足以证明 CSS 是 UTM。

  • @CedricMamo但是你的点击改变了状态，你只需要点击正确的地方，否则它将不起作用。准确地查看 http://eli.fox-epste.in/rule110-full.html 我可以单击任何单元格，如果 CSS 被禁用，我仍然单击正确的单元格并具有 UTM。如果您所做的只是单击“下一步”按钮，那么 CSS 确实就是 UTM，但是要实现类似的功能，您需要一些每次单击按钮都会调用的 JS，正如我们所知，JS 就是 UTM。对于CSS，你需要有一些能够正确解释结果和更新状态的东西。 (2认同)

Mau*_*abo 6

图灵完整性不仅与"定义函数"或"具有ifs/loops/etc"有关.例如,Haskell没有"循环",lambda-calculus没有"ifs"等...

例如,这个网站:http://experthuman.com/programming-with-nothing.作者使用Ruby并创建一个只有闭包的"FizzBu​​zz"程序(没有字符串,数字或类似的东西)......

有些例子是人们只使用类型系统在Scala上计算一些算术函数

所以,是的,在我看来,CSS3 + HTML是图灵完备的(即使你不能完全做任何真正的计算而不会变得疯狂)

  • 不打算冒犯,图灵完整性不会回应任何人的意见. (17认同)
  • Haskell和lambda-caclculus有递归.CSS吗？你必须疯狂地在Malbolge做任何真正的计算; 在CSS中,你有多疯狂并不重要:它不会起作用,CSS不是完整的,这不是意见问题. (11认同)
  • 抱歉,我在此页面中找不到您的任何其他评论.但正如在接受的答案中所指出的那样,只要你认为(......)用户交互是CSS"执行"的一部分,它就是Turing-complete"(...).我没有. (11认同)
  • @MaurícioSzabo不,CSS3加上HTML +*人类不断踩着模拟*是图灵完成的. (4认同)
  • @LambdaFairy每个物理图灵机都是如此. (4认同)
  • @OrangeDog 如果你继续这个论点，那么 MS Paint 就是图灵完备的。你在哪里划清界限？ (4认同)
  • @LambdaFairy 都不是语言的一部分 (2认同)
  • @LambdaFairy 正是定义告诉你的地方。图灵完备性是严格定义的数学结构的数学属性。编程语言可以是图灵完备的，没有任何有限的物理系统（包括计算机）可以是。 (2认同)
  • 那么，用户重复按下按钮不就和系统时钟对 CPU 所做的事情是一样的吗？只要用户不必做出任何关于按下什么的决定，那就是等价的。您对您的问题（任何可计算的问题）进行编码，然后无论该问题是什么，您都只需执行相同的操作：驱动“系统时钟”。假设您编写了一个简短的 Javascript 函数，以便以编程方式查看并持续按下同一个按钮。JS 函数肯定不是图灵完备的。计算将由 CSS 完成。什么或谁驱动时钟是无关紧要的。 (2认同)

Hen*_*and 5

这里的根本问题是，除非代码是无限长的，否则任何用HTML + CSS编写的机器都无法评估无限多的步骤（即，不可能有“真实的”递归）。而这个问题将这款机器达到配置H的n步骤或更少的是，如果总是回答的n是有限的。

  • @AdamDavis这是一个完全有效的论点：如果存在一种算法可以解决图灵完全形式主义的停顿问题，那通常就等于解决停顿问题。当然，这已被证明是不可能的，这意味着，如果可以针对给定的形式主义解决停顿问题，那么形式主义一定不是图灵完备的。因此，所有只能评估有限数量步骤的形式主义都不能包含图灵完备的CSS。 (3认同)
  • 如果不是B，那么A不是*！如果不是**则不是**！前者是[确认结果]（https://en.wikipedia.org/wiki/Affirming_the_consequent），您正确指出的是错误的。我使用的是后者，[通过对立论证]（https://en.wikipedia.org/wiki/Proof_by_contrapositive）。请注意，我在上一条评论中对否定进行了谨慎使用-我专门构造了它来避免这种谬误。 (3认同)
  • 我没有看到图灵机要求中哪里指定了处理无限循环的能力。你的第二点似乎不成立。虽然图灵使用他的图灵机来证明可计算性问题，但这些规则（如停止问题）并不能确定机器是否是图灵机。如果图灵机将这些假设作为要求，他就无法使用图灵机来证明它们。 (2认同)
  • @AdamDavis 如果 CSS 不能表达无限循环，那么它对停止问题的答案是微不足道的——程序将永远停止。由于所有图灵完备语言都存在不可判定的停止问题，这使得 CSS 不再是图灵完备的。 (2认同)
  • @woojoo666 不。能够根据一组规则转换状态并不等同于图灵完备。没有任何东西只能通过有限数量的步骤才能完成。如果转换规则集只能应用有限次，那么问题“系统会达到状态‘H’吗？” 总是可判定的，因此它不是图灵完备的。只能进行有限次数迭代的元胞自动机的实现永远不可能是图灵完备的。 (2认同)
  • “而且，是的，CSS 也是图灵完备的”_[需要引用]_ (2认同)

归档时间：

查看次数：

109390 次

最近记录：

6 年，6 月 前
使用jQuery选择和操作CSS伪元素,例如:: before和:: after 897
更多相关链接
相关归档
在CSS3动画结束时维护最终状态 266
在同一行左右对齐两个内联块 98
是否可以使用CSS在鼠标悬停在图像映射上？ 47
属性选择器,其中值等于A或B？ 46
使用CSS更改悬停时兄弟元素的颜色 38
有没有办法检测CSS文件何时完全加载？ 31
如何在父级内自动垂直堆叠div？ 24
如何控制边框高度？ 22
常规CSS属性顺序 16
如何在OL中增加序列号的大小 16
难疑归档
如何在JavaScript中替换所有出现的字符串 4081
从Git存储库中删除文件而不从本地文件系统中删除它 2892
如何克隆特定的Git分支？ 2804
什么是sleep()的JavaScript版本？ 2115
HTML中id属性的有效值是什么？ 1945
什么是Android上的"上下文"？ 1872
以像素为单位获取屏幕尺寸 1798
如何一次删除所有Git stashes？ 1280
如何在PHP中进行重定向？ 1201
从Docker容器内部,如何连接到本机的本地主机？ 1176