[Перевод] Atomic CSS здорового человека

Скрипты и советы | 1 декабря 2023 643

Уроки CSS на Хабрахабре, habrahabr.ru, Веб-разработка, CSS, JavaScript, HTML, css, tailwind, Windi CSS, atomic css, UnoCSS,

Перевод статьи «Reimagine Atomic CSS» двухлетней давности одного из членов команды Vue core Anthony Fu, автора UnoCSS, в которой обсуждается концепция Atomic CSS, плюсы и минусы Tailwind и Windi CSS

Что такое Atomic CSS?

Для начала давайте дадим правильное определение атомарному CSS. Из этой статьи Джона Полачека:

> Атомарный CSS — это подход к архитектуре CSS, при котором предпочтение отдается небольшим, одноцелевым классам с именами, основанными на визуальной функции.

Читать далее
[Перевод] Atomic CSS здорового человека. UnoCSS

Продолжение перевода статьи «Reimagine Atomic CSS» двухлетней давности одного из членов команды Vue core Anthony Fu,...

Подробнее
Tailwind не только для MVP

Всем привет! Обычно tailwind используют для каких-то MVP/админок/не очень больших проектов, но мне кажется, что...

Подробнее
[Перевод] Топ рекомендаций по Core Web Vitals на 2023 год

Привет, друзья! Представляю вашему вниманию перевод этой замечательной статьи, представляющей собой коллекцию лучших...

Подробнее
[Перевод] CSS: полное руководство по функции calc()

В CSS есть особая функция calc(), применяемая для выполнения простых вычислений. Вот пример её использования:...

Подробнее
[Перевод] Провал Tailwind, инструмента для невежд

Привет, Хабр! Не так давно в нашем блоге вышел перевод статьи «Взлет и падение Bootstrap». Как указали в комментариях...

Подробнее
[Перевод] Руководство по цветовым функциям CSS

Возможно, вы использовали CSS для изменения цвета элемента на веб-странице, но слышали ли вы что-нибудь о цветовых...

Подробнее

💬 Комментарии

В связи с новыми требованиями законодательства РФ (ФЗ-152, ФЗ «О рекламе») и ужесточением контроля со стороны РКН, мы отключили систему комментариев на сайте.

🔒 Важно Теперь мы не собираем и не храним ваши персональные данные — даже если очень захотим.

💡 Хотите обсудить материал?

Присоединяйтесь к нашему Telegram-каналу:

https://t.me/tcsecms

Нажмите кнопку ниже — и вы сразу попадёте в чат с комментариями