Чи завершено CSS Turing?

297

CSS не є, наскільки я знаю, Turing завершений. Але мої знання про CSS дуже обмежені.

Чи завершено CSS Turing?
Чи хтось із існуючих проектів чи комітетів розглядає мовні особливості, які могли б забезпечити повноту Тюрінга, якщо це не зараз?

css turing-complete

28

Це вже зроблено, якщо ви використовуєте ie6. Їх називають виразами CSS, і консенсус - вони жахливо порушені та небезпечні. JS вбудований у CSS ...

— kibibu

13

@Kibibu - Yikes! Будь ласка, видаліть цю ідею з мого мозку, перш ніж вона складеться!

— DVK

Яким чином CSS може бути завершеним Тьюрінгом?

— СЛАкс

1

@DVK: ви насправді можете зробити з ними якісь цікаві речі - особливо щодо незалежної роздільної здатності розміщення - які все ще хитрі чи химерні в CSS, не вдаючись до таблиць. Я думаю, якби вони обмежили це суто декларативною мовою вираження без побічних ефектів замість того, щоб дозволити повний доступ до двигуна скрипту, це було б краще отримано (а може бути, якби веб-код придумав це першим)

— kibibu

5

@SLaks: Не варто недооцінювати потужність HTML5 / CSS3 :)

— Niklas B.

385

Ви можете кодувати правило 110 у CSS3, так що він є повним Turing, якщо ви вважаєте, що відповідний супровідний 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"/>

Розгорніть фрагмент

— Адам Девіс
джерело

2

Офіційне визначення (найпростіше) машини Тюрінга - це просто набір станів, набір символів, початковий стан, набір станів приймання та функція переходу. В цьому немає ніякого кривошипа. Під обчисленням ми маємо на увазі, що комусь потрібно достовірно застосувати функцію переходу на стрічку, яка точно подібна клацанню в цьому випадку. Більш формально модель обчислення може розглядатися як набір правил, яким потрібно дотримуватися, щоб зробити обчислення. У цьому сенсі я думаю, що CSS є Тьюрінг-завершеним.

— Джон

2

Схоже, цей фрагмент не працює (Firefox 61). Я бачу сітку порожніх прапорців - нічого не відбувається, якщо ви їх перевірите.

— OrangeDog

2

@John "CSS turing завершений" робить мене непросто, але у мене немає проблем із "CSS є настільки ж повним, як пара скель на пляжі ". Чи було б останнє твердження правильним?

— Рафаель Шмітц

1

@ R.Schmitz ні, в такому випадку людина вибирає, куди поставити скелі, тому комбінована система людини + гірських порід є повною. У наведеному вище прикладі CSS клавіша клавіша tab + пробіл - це простий процес, що повторюється, схожий на скажімо, ланцюг зворотного зв'язку. Отже, якщо C ++ завершує використання комп’ютерного обладнання для виконання вказівок, тоді говорити, що CSS завершується, використовуючи

— повторне

Ось CodePen Правила 110, що використовує те саме рішення, плюс примітки та деякі Sass, щоб допомогти висушити речі: codepen.io/laras126/pen/OYvGZj Я написав супроводжуючу публікацію в блозі з поясненням понять тут: notlaura.com/is-css -turing-завершено

— notlaura

89

Одним із аспектів повноти Тьюрінга є проблема зупинки .

Це означає, що якщо CSS завершено Turing, то не існує загального алгоритму для визначення того, чи буде програма CSS назавжди закінчена чи циклічна.

Але ми можемо отримати такий алгоритм для CSS! Ось:

Якщо таблиця стилів не оголошує жодної анімації , вона зупиниться.
Якщо у нього є анімація, то:
- Якщо animation-iteration-countє infinite, а селектор, що містить міститься у HTML, він не зупинятиметься.
- Інакше це зупиниться.

Це воно. Оскільки ми щойно вирішили проблему зупинки для CSS, випливає, що CSS не є Тюрінгом завершеним .

(Інші люди згадували IE 6, який дозволяє вбудовувати довільні вирази JavaScript в CSS; це, очевидно, додасть повноті Тьюрінга. Але ця функція є нестандартною, і ніхто з розумом не використовує її.)

Даніель Вагнер підніс точку, яку я пропустив у оригінальній відповіді. Він зазначає, що, хоча я висвітлював анімацію , інші частини двигуна стилів, такі як вибір секторів або макет, також можуть призвести до повноти Тьюрінга. Хоча важко зробити офіційний аргумент з цього приводу, я спробую окреслити, чому повнота Тьюрінга все ще навряд чи відбудеться.

По-перше: Turing цілі мови мають певний спосіб повернення даних у себе , будь то шляхом рекурсії чи циклічного циклу. Але дизайн мови CSS ворожий до цього відгуку:

@mediaзапити можуть перевіряти лише властивості самого браузера, такі як розмір вікна перегляду або роздільна здатність пікселя. Ці властивості можуть змінюватися за допомогою взаємодії з користувачем або кодом JavaScript (наприклад, зміна розміру вікна браузера), але не лише через CSS.
::beforeі ::afterпсевдоелементи не вважаються частиною DOM і не можуть бути зіставлені будь-яким іншим чином.
Комбінатори селекторів можуть перевіряти лише елементи над та перед поточним елементом, тому їх не можна використовувати для створення циклів залежності.
Можна перемістити елемент у напрямку, коли ви наводите курсор на нього , але положення оновлюється лише при переміщенні миші.

Цього має бути достатньо, щоб переконати вас у тому, що відповідність селектора, сама по собі, не може бути Тюрінг завершеною . А як щодо компонування?

Сучасний алгоритм компонування CSS дуже складний, з такими функціями, як Flexbox та Grid, що замулюють води. Але навіть якби можна було запустити нескінченний цикл з компонуванням, було б важко використовувати це для виконання корисних обчислень. Це тому, що селектори CSS перевіряють лише внутрішню структуру DOM, а не те, як ці елементи розміщуються на екрані. Отже, будь-який доказ повноти Тюрінга з використанням системи компонування повинен залежати лише від макета .

Нарешті - і це, мабуть, найважливіша причина - продавці браузерів зацікавлені в тому, щоб CSS не був Тьюрінгом завершеним . Обмежуючи мову, постачальники забезпечують розумні оптимізації, які роблять Інтернет швидшим для всіх. Крім того, Google присвячує цілу ферму серверів пошуку помилок у Chrome. Якби був спосіб записати нескінченний цикл за допомогою CSS, вони, мабуть, знайшли б це вже 😉

— Фея лямбда
джерело

4

Коли люди кажуть, що "CSS turing завершено" вони означають "CSS, який підтримує анімацію, Turing Complete". Ви можете обмежити мови програмування і зробити висновок, що вони не є Turing Complete, використовуючи вашу логіку, але вам доведеться вказати обмеження.

— Філікс

36

Я думаю, що ця відповідь використовує смішне визначення поняття «зупинити» - звичайно, не те, про що я хотів би, якби я хоч би задав питання. Ви, здається, використовуєте "зупинка", щоб означати "настає час, коли обчислювані властивості кожного елемента припиняють змінюватися"; але я хотів би означати "зупинка" означати "алгоритм, який перетворює декларативний CSS в обчислювані властивості всіх елементів закінчує виконання". З останньою дефініцією, здається, потрібно аргументувати значно більше, ніж просто "анімації немає".

— Даніель Вагнер

4

Ваша логіка тут відстала. Тюрінг повноти означає, що зупинка не визначається, не означає, що зупинка не визначається, має на увазі повноту Тюрінга.

— асмеурер

3

@LambdaFairy Яка проблема зупинки CSS ? Я не вірю, що таке існує. Проблема зупинки стосується лише машин. Найпотужніша обчислювальна модель, яку ми сьогодні маємо, - це машини Тьюрінга. Ваш комп'ютер настільки ж потужний, як і машина Тюрінга (без нескінченної пам'яті). Сам CSS не можна визначити машиною. Можливо, ви можете визначити двигун CSS браузера як машину, але навіть тоді він може бути настільки ж потужним, як TM. Заява "проблема зупинки для CSS " просто не має сенсу, якщо CSS не став новим автоматом в ієрархії Чомського.

— Майк Ши

3

@LambdaFairy Ви не розумієте, як виглядатиме доказ твердження неповноти. Ми знаємо, що проблема зупинки не може бути вирішена ТМ. Оригінальний доказ, схоже, висуває претензію, оскільки CSS може вирішити проблему зупинки, яка не є завершеною. Якщо CSS міг би справді вирішити проблему зупинки, то CSS сильніше, ніж машина Тьюрінга, оскільки він може обчислити те, що TM не може. Ми знаємо (за тезою Церкви-Тьюрінга), що машина не може бути побудована сильніше, ніж обчислення TM / Lambda. Тому це суперечність, і ваше первісне твердження не вірно.

— Ісаак Діамант

32

Відповідно до цієї статті, це не так . У статті також стверджується, що зробити це не надто добре.

Цитувати з одного з коментарів:

Тож я не вірю, що CSS завершується. Немає можливості визначити функцію в CSS. Для того, щоб система була цілісною, необхідно створити інтерпретатор: функцію, що інтерпретує вирази, що позначають програми для виконання. CSS не має змінних, які безпосередньо доступні користувачеві; тому ви навіть не можете моделювати структуру, яка представляє програму для інтерпретації в CSS.

— DVK
джерело

4

CSS не виконується жодним чином. Людина, яка написала цитований коментар, схоже, цього не розуміє. : - \

— Пріоритет Райана

33

CSS - це набір інструкцій процесору (верстка двигуна). Що так не "виконуваного" в цьому?

— DVK

47

Тюрінг-повнота полягає не лише в тому, якщо ви можете писати програми так, як вам хочеться, чи вірою. Це математична властивість щодо обчислюваності. Таким чином, ви не можете повірити чи ні, що CSS завершений Тьюрінгом, вам потрібно доказ. У цьому випадку через правило 110 CSS є повним Тьюрінгом.

— Mikaël Mayer

15

@ MikaëlMayer - як зазначено у багатьох коментарях у відповіді "110", що користувач повинен виконати дію. Якщо потрібні дії користувача, CSS без користувача НЕ закінчується

— DVK

1

@DVK повторювані натискання клавіш, необхідні на прикладі CSS 110, - не зовсім "дія" користувача, вони можуть виконуватись повторюваною цифровою схемою. Насправді машини для тюрінгу вимагають певного електричного обладнання для керування виконанням, тому я не бачу, чим це відрізняється

— woojoo666

6

Тюрінг-повнота стосується не лише "визначення функцій" або "мати ifs / loops / тощо". Наприклад, у Haskell немає "циклу", лямбда-числення не має "ifs" тощо.

Наприклад, цей сайт: http://experthuman.com/programming-with-nothing . Автор використовує Ruby і створює програму "FizzBuzz" лише із закриттями (без рядків, цифр чи нічого подібного) ...

Є приклади, коли люди обчислюють деякі арифметичні функції на Scala, використовуючи лише типову систему

Так, так, на мою думку, CSS3 + HTML є завершеним (навіть якщо ви не можете точно виконати жодного реального обчислення з тим часом, не ставши божевільним)

— Маурісіо Сабо
джерело

11

Хаскелл і лямбда-калькулюс мають рекурсію. CSS? Ви повинні бути божевільними, щоб робити будь-які реальні обчислення в Мальболжі; в CSS не має значення, як ти божевільний: він не працюватиме, CSS не є повним, і це не питання думки.

— JMCF125

11

На жаль, я не зміг знайти жодного іншого вашого коментаря на цій сторінці. Але як зазначається у прийнятій відповіді, це "повне" Тьюрінга "(...), якщо ви вважаєте, що (...) взаємодія користувачів є частиною" виконання "CSS". А я ні.

— JMCF125

20

Не маючи наміру бути образливим, цінність повноти не відповідає на думку кого-небудь.

— trisweb

5

@ MaurícioSzabo Ні, CSS3 плюс HTML плюс людина, що постійно крокує моделювання , Turing завершений.

— Фея лямбда

4

@LambdaFairy Це теж стосується всіх машин для фізичного закріплення.

— Майлз Рут

5

Принциповим питанням є те, що будь-яка машина, написана на HTML + CSS, не може оцінити нескінченно багато кроків (тобто не може бути "справжньої" рекурсії), якщо код нескінченно довгий. І питання, чи зможе ця машина досягти конфігурації Hз nкроком або менше, завжди відповідає, якщо nвона обмежена.

— Генрік Соммерланд
джерело

1

Я не бачу, де в вимогах Машини Тьюрінга вказана здатність обробляти нескінченні петлі. Ваш другий пункт не видається дійсним. У той час як Тьюрінг використовував свою машину Тьюрінга для доведення питань обчислюваності, ці правила, як і проблема зупинки, не визначають, чи машина є машиною Тьюрінга чи ні. Якщо машина Тьюрінга включала ці гіпотези як вимоги, він би не міг використати машину Тьюрінга для їх доказування.

— Адам Девіс

4

@AdamDavis Це цілком коректний аргумент: якщо існує алгоритм, який вирішує проблему зупинки для формалізму Тьюрінга, це рівнозначно вирішенню проблеми зупинки в цілому. Звичайно, це виявилося неможливим, це означає, що якщо проблема зупинки може бути вирішена для заданого формалізму, то цей формалізм не повинен бути повним Тьюрінгом. Тому всі формалізми, які можуть оцінити лише кінцеву кількість кроків, не можуть бути завершеними Тьюрінгом, включаючи CSS.

— 00дані

3

Це не якщо B, то A! Це якщо не Б, то не А ! Перший - це підтвердження наслідку , що ви правильно вказуєте, що це неправильно. Останнє, аргумент контрастного , - це те, що я використовую і є дійсним. Зверніть увагу на обережне використання заперечення в моєму останньому коментарі - я сконструював це спеціально, щоб уникнути цієї помилки.

— Фея лямбда

1

@ woojoo666 Ні. Можливість перетворення стану відповідно до набору правил - це не те, що завершення Тьюрінга. Ніщо, що може бути лише за певну кількість кроків, ніколи не може бути завершеним. Якщо набір правил перетворень можна застосувати лише в кінцевій кількості разів, питання "Чи коли-небудь система досягне стану H?" завжди вирішальний, і тому Тьюрінг не завершений. Реалізація стільникового автомата, яка може виконати лише кінцеву кількість ітерацій, ніколи не може бути завершеною.

— Генрік

1

"І так, також CSS завершується" [потрібна цитата]

— Andrea Lazzarotto

4

Ця відповідь не є точною, оскільки поєднує опис UTM та UTM (Universal Turing Machine).

У нас є хороша відповідь, але з іншого погляду, і вона не показує прямо недоліків у поточній відповіді.

Перш за все ми можемо погодитись, що людина може працювати як UTM. Це означає, якщо ми це зробимо

CSS + Human == UTM

Тоді CSSчастина є марною, тому що всю роботу може виконати той, Humanхто буде виконувати частину UTM. Акт клацання може бути UTM, тому що ви клацаєте не випадково, а лише в певних місцях.

Замість CSS я міг би використовувати цей текст ( Правило 110 ):

000 -> 0
001 -> 1
010 -> 1
011 -> 1
100 -> 0
101 -> 1
110 -> 1
111 -> 0

Направляти мої дії та результат буде однаковим. Це означає цей текст UTM? Ні, це лише вхід (опис), який інші UTM (людині чи комп'ютері) можуть читати та запускати. Клацання достатньо, щоб запустити будь-який UTM.

Критична частина, якої бракує CSS, - це можливість змінити свій власний стан довільним чином, якщо CSS може генерувати кліки, то це буде UTM. Аргумент того, що ваші кліки "кривошипні" для CSS, не є точним, оскільки справжній "кривошип" для CSS - це Layout Engine, який його запускає, і цього має бути достатньо, щоб довести, що CSS є UTM.

— Янки
джерело

Правило 110 - це UTM. Ваш текст є (мабуть, дещо недостатнім) описом правила 110, тому так, цей текст є (представленням а) UTM.

— OrangeDog

"Якщо CSS міг генерувати кліки", я використовую багато мікроконтролерів AVR у своїх проектах. Можна або використовувати внутрішній тактовий час, який обмежений 8 МГц. Крім того, ви можете підключити зовнішній кристал і піднятися до 20 МГц. Крім того, я міг би просто поставити повністю зовнішній годинник, так що це навіть не процесорне обладнання, яке насправді веде кристал. Це означає, що я можу фактично підключити вимикач і шматок ланцюга, щоб роз'єднати його, і буквально використовувати це як годинник зі мною, натиснувши кнопку. Чи означає це, що він перестає бути завершеним, якщо я це роблю?

— Седрік Мамо

1

@CedricMamo Але ваші кліки змінюють стан, і вам потрібно натискати лише правильні місця, які не працюють. Подивіться точно на eli.fox-epste.in/rule110-full.html Я можу натиснути ЯКЩО клітинку, якщо CSS відключений, я все одно натискаю правильні комірки та маю UTM. Якщо все, що ви робите, було б натиснути одну кнопку «далі», то справді CSS був би UTM, але щоб мати щось подібне, вам знадобиться мати JS, який дзвонить за натискання кнопки, і, як ми знаємо, JS IS UTM. Для CSS потрібно мати щось, що буде правильно інтерпретувати результат та оновити стан.

— Янкі

1

@CedricMamo якесь посилання на нього? Зараз я переглядаю кілька прикладів звідти, але це не працює для мене. Загалом, якщо я правильно розумію, CSS змінить видимість деяких прапорців, і ви використовуєте вкладки для переходу до наступного, і тут ми знову приховали UTM, що не є CSS, тому що при вкладці ви попросите браузера обчислити наступну дійсну позицію для навігації, і для того, щоб зробити це багато СКЛАДНОГО коду, для цього використовується CSS, але набагато більше. Це означає, що ви довели, що ваш браузер UTM не CSS.

— Янки

1

@CedricMamo Але стільникові автомати мають власне визначення циклу, коли перехід стану виконується, тоді він запускається знову, і знову, і т. Д. Якщо ми видалимо його і залишимо лише цей перехід стану, ці автомати вже не будуть UTM. Це буде точно така ж ситуація, як і CSS. Ми можемо визначити два етапи в CA, R- стан читання і W- стан запису, нормальний СА виконувати нескінченну послідовність RWRWRWRW...у випадку, якщо у нас є лише CSS R, а у нас немає, Wоскільки він змінює речі, які він не може прочитати, лише якщо додамо B- дії браузера тоді ми могли б мати, RBRBRBR...але тоді він BBBBBBзнаходиться на власній UTM.

— Янки

-28

CSS не є мовою програмування, тому питання про повну повноту є безглуздим. Якщо до CSS додаються розширення програмування, як це було в IE6, то новий синтез - це зовсім інша річ.

CSS - це лише опис стилів; вона не має жодної логіки, а її структура є плоскою.

— Райан Пріор
джерело

1

Крім того (IIRC), існує певна неоднозначність щодо того, які стилі мають перевагу при використанні декількох конфліктуючих (дублюючих) стилів. І тоді є дещо різні способи, якими різні браузери реалізують / інтерпретують стилі розмітки для вирішення.

— David R Tribble

70

"CSS не є мовою програмування, тому питання про повну повноту є безглуздим". Тавтологічні речення є тавтологічними.

— Адам Девіс

3

Погляньте на мову програмування Prolog, якщо вам цікаво, чому ваша відповідь так сильно заперечується.

— Edwin