当前位置:  开发笔记 > 编程语言 > 正文

CSS图灵完成了吗?

如何解决《CSS图灵完成了吗?》经验,为你挑选了5个好方法。

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

CSS图灵完成了吗?

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

Jakob.. 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; }

Rule 110 in (webkit) CSS, proving Turing-completeness.



1> Jakob..:

您可以在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; }

Rule 110 in (webkit) CSS, proving Turing-completeness.



2> Lambda Fairy..:

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

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

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

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

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

如果有任何animation-iteration-countinfinite和含选择在HTML匹配,那么就不会停止.

否则,它将停止.

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

3> DVK..:

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

引用其中一条评论:

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


如果你能以你想要的方式或信仰来编写程序,图灵完整性不仅仅是关于.它是关于可计算性的数学特性.所以你不能相信CSS是图灵完整的,你需要一个证明.在这种情况下,由于规则110,CSS是图灵完备的.
CSS是处理器(布局引擎)的一组指令.什么不是"可执行"的呢?
@MikaëlMayer - 正如"110"答案中的许多评论所述,需要用户执行操作.如果需要用户操作,则没有用户的CSS不是图灵完成
CSS不以任何方式执行.撰写引用评论的人似乎并不理解.: - \

4> Maurício Sza..:

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

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

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

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


不打算冒犯,图灵完整性不会回应任何人的意见.
Haskell和lambda-caclculus有递归.CSS吗?你必须疯狂地在Malbolge做任何真正的计算; 在CSS中,你有多疯狂并不重要:它不会起作用,CSS不是完整的,这不是意见问题.
抱歉,我在此页面中找不到您的任何其他评论.但正如在接受的答案中所指出的那样,只要你认为(......)用户交互是CSS"执行"的一部分,它就是Turing-complete"(...).我没有.
@MaurícioSzabo不,CSS3加上HTML +*人类不断踩着模拟*是图灵完成的.
@LambdaFairy每个物理图灵机都是如此.

5> Henrik Somme..:

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


@AdamDavis这是一个完全有效的论点:如果存在一种算法可以解决图灵完全形式主义的停顿问题,那通常就等于解决停顿问题。当然,这已被证明是不可能的,这意味着,如果可以针对给定的形式主义解决停顿问题,那么形式主义一定不是图灵完备的。因此,所有只能评估有限数量步骤的形式主义都不能包含图灵完备的CSS。
如果不是B,那么A不是*!如果不是**则不是**!前者是[确认结果](https://en.wikipedia.org/wiki/Affirming_the_consequent),您正确指出的是错误的。我使用的是后者,[通过对立论证](https://en.wikipedia.org/wiki/Proof_by_contrapositive)。请注意,我在上一条评论中对否定进行了谨慎使用-我专门构造了它来避免这种谬误。
推荐阅读
手机用户2402852307
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有