Вчинення злочинів CSS

зображення

Час CSS-трюків закінчився. Настав час для CSS Crimes!

У нинішньому середовищі постачальників контент-послуг користувачі часто обмежуються висловлюванням у тексті, посиланнях і зображеннях. Правила дезінфекції, як правило, видаляють HTML, JavaScript і різні атрибути.

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

Блекл Морі створив хитру штуку де повільне потягування за ручку повертає ряд шестерень, шківів і ланцюгів. Згодом відкривається отвір, щоб побачити талісман сайту («жука») і проголошення «Гарна робота!». Я дивився на це в інструментах розробника, і це дивовижне поєднання grid, resize, transform та calc(). Зрештою я додав a border для всіх <div>s щоб спробувати краще зрозуміти, як рухався кожен окремий елемент.

У минулому були ситуації, коли мене обмежували у використанні повного інструментарію HTML, JavaScript і CSS. Було багато випадків використання декоративних Форми CSS щоб обійти зображення. Я використовував :hover як обхідний шлях для mouseenter та mouseleave. Я використовував input:checked як селектор братів і сестер для перемикання.

Хоча CSS Crimes, ймовірно, не те, що ви хотіли б використовувати на регулярній основі, ми повинні прийняти експерименти в рамках обмежень, які можуть сприяти творчим рішенням.


Пряме посилання →

Часова мітка:

Більше від CSS-хитрощі