HTML Academy (старое) в мессенджере MAX — 64 подписчиков, аналитика и статистика

Последние публикации канала «HTML Academy (старое)»

1. 147 просмотров, 10 февр. 2026 г.

   Изменилось закреплённое сообщение чата

2. 286 просмотров, 3 реакций, 10 февр. 2026 г.

   Мы перевезли канал в Максе на правильное место. Чтобы получать наши новости, подписывайтесь https://max.ru/htmlacademy

3. 205 просмотров, 1 реакций, 09 февр. 2026 г., изображение

   clip-path и CSS-маски не меняют форму блока — они её имитируют. Рамка, тень, outline не знают о вырезах и работают как с обычным прямоугольником. Свойство border-shape работает по-другому. Как border-radius научил рамки скругляться, так border-shape + функция shape() учат их принимать произвольную форму. Рамки повторяют контур, box-shadow и outline тоже. В спецификации CSS Borders Level 4 уже есть черновик, а в Chrome Canary — первые работающие прототипы. Пока ждём поддержку в браузерах, самое время разобраться с функцией shape(). В новом выпуске «CSS Боли» — как мы дошли от border-radius…

   
4. 210 просмотров, 09 февр. 2026 г., изображение

   clip-path и CSS-маски не меняют форму блока — они её имитируют. Рамка, тень, outline не знают о вырезах и работают как с обычным прямоугольником. Свойство border-shape работает по-другому. Как border-radius научил рамки скругляться, так border-shape + функция shape() учат их принимать произвольную форму. Рамки повторяют контур, box-shadow и outline тоже. В спецификации CSS Borders Level 4 уже есть черновик, а в Chrome Canary — первые работающие прототипы. Пока ждём поддержку в браузерах, самое время разобраться с функцией shape(). В новом выпуске «CSS Боли» — как мы дошли от border-radius…

   Открыть пост в MAX
5. 141 просмотров, 09 февр. 2026 г., изображение

   DUMP SPB 2026 × HTML Academy Весь внешний вид компонента — в CSS-переменных. JavaScript только переключает состояния. Звучит непривычно, но это рабочий подход. На DUMP SPB 13 февраля Александр Першин выступит с докладом «Реактивный CSS» — про перенос логики отображения из JavaScript в стили. В докладе — сравнение двух реализаций одного компонента: классической на JS и реактивной на CSS. Можно будет оценить разницу в объёме и сложности кода. Промокод PERSHIN — скидка 10% на билет. Конференция · О докладе

   Открыть пост в MAX
6. 139 просмотров, 3 реакций, 09 февр. 2026 г., изображение

   DUMP SPB 2026 × HTML Academy Весь внешний вид компонента — в CSS-переменных. JavaScript только переключает состояния. Звучит непривычно, но это рабочий подход. На DUMP SPB 13 февраля Александр Першин выступит с докладом «Реактивный CSS» — про перенос логики отображения из JavaScript в стили. В докладе — сравнение двух реализаций одного компонента: классической на JS и реактивной на CSS. Можно будет оценить разницу в объёме и сложности кода. Промокод PERSHIN — скидка 10% на билет. Конференция · О докладе

   
7. 112 просмотров, 06 февр. 2026 г., изображение

   Cursor, Claude Code, Qwen Code — инструменты есть, а системы нет. Большинство разработчиков используют ИИ от случая к случаю: спросил — получил ответ — забыл. На курсе «Фронтенд на автопилоте» вы пройдёте полный цикл разработки интернет-магазина вместе с ИИ: настройка окружения, генерация компонентов, тесты, документация, интеграция API. К концу курса — готовый проект и навык, который встраивается в ежедневную работу. #htmlacademy #levelup 🧬 Записаться на курс

   
8. 110 просмотров, 1 реакций, 06 февр. 2026 г., изображение

   Cursor, Claude Code, Qwen Code — инструменты есть, а системы нет. Большинство разработчиков используют ИИ от случая к случаю: спросил — получил ответ — забыл. На курсе «Фронтенд на автопилоте» вы пройдёте полный цикл разработки интернет-магазина вместе с ИИ: настройка окружения, генерация компонентов, тесты, документация, интеграция API. К концу курса — готовый проект и навык, который встраивается в ежедневную работу. #htmlacademy #levelup 🧬 Записаться на курс

   
9. 103 просмотров, 3 реакций, 06 февр. 2026 г., изображение

   Мы учим писать код, а не полагаться на удачу. Но в эти выходные — исключение. С 6 по 8 февраля ко Дню науки разыгрываем скидки с помощью удачи. Отправляете эмодзи 🎰 в комментарии к посту в Телеграме — барабан крутится сам, а комбинация определяет вашу скидку: 20%, 30% или 40%. Проигравших нет. Переходите в наш Telegram-канал и пробуйте → https://t.me/htmlacademy

   
10. 93 просмотров, 06 февр. 2026 г., изображение

    Круглый вырез в карточке — пять обёрток, 20 строчек CSS и сломанный фон на стыках блоков. Знакомо? Классический подход заставляет «нарезать» карточку на кусочки: колонка для контента, колонка для выреза, внутри — три блока с flex-grow и radial-gradient. И всё ломается, если карточке задать градиентный фон — состыковать части принципиально невозможно. Одно свойство mask-image с тем же radial-gradient решает задачу без единой обёртки. Карточка остаётся цельной — и корректно тянется, и принимает любой фон. В статье собираем оба варианта пошагово и сравниваем. Демонстрация:…

    
11. 93 просмотров, 2 реакций, 06 февр. 2026 г., изображение

    Круглый вырез в карточке — пять обёрток, 20 строчек CSS и сломанный фон на стыках блоков. Знакомо? Классический подход заставляет «нарезать» карточку на кусочки: колонка для контента, колонка для выреза, внутри — три блока с flex-grow и radial-gradient. И всё ломается, если карточке задать градиентный фон — состыковать части принципиально невозможно. Одно свойство mask-image с тем же radial-gradient решает задачу без единой обёртки. Карточка остаётся цельной — и корректно тянется, и принимает любой фон. В статье собираем оба варианта пошагово и сравниваем. Демонстрация:…

    
12. 90 просмотров, 05 февр. 2026 г., изображение

    Qwen Code — AI-агент для VS Code, который генерирует готовый код прямо в терминале. Создание даже простой портфолио-страницы обычно занимает часы: разметка, стили, адаптивность, тёмный режим. В статье показываем, как за три запроса к Qwen Code получить готовую страницу с семантическим HTML, CSS-переменными и поддержкой тёмного режима. Разбираем установку расширения Qwen Code Companion в VS Code, запуск через команду qwen и пошаговое взаимодействие: от структуры проекта до финальной стилизации. #ai #tools ⚡️ Читать статью

    
13. 90 просмотров, 3 реакций, 05 февр. 2026 г., изображение

    Qwen Code — AI-агент для VS Code, который генерирует готовый код прямо в терминале. Создание даже простой портфолио-страницы обычно занимает часы: разметка, стили, адаптивность, тёмный режим. В статье показываем, как за три запроса к Qwen Code получить готовую страницу с семантическим HTML, CSS-переменными и поддержкой тёмного режима. Разбираем установку расширения Qwen Code Companion в VS Code, запуск через команду qwen и пошаговое взаимодействие: от структуры проекта до финальной стилизации. #ai #tools ⚡️ Читать статью

    
14. 87 просмотров, 1 реакций, 03 февр. 2026 г., изображение

    Стандартные ease и ease-in не всегда дают нужный эффект — движение получается слишком механическим или предсказуемым. Функция cubic-bezier() позволяет задать собственную кривую ускорения через четыре числа. С ней можно сделать анимацию с эффектом инерции, лёгкого залипания при наведении или упругого отскока. Разбираем, как работают координаты управляющих точек и где это применяется: в модалках, карточках, галереях. #css #animation ⚡️ Читать статью

    
15. 87 просмотров, 03 февр. 2026 г., изображение

    Стандартные ease и ease-in не всегда дают нужный эффект — движение получается слишком механическим или предсказуемым. Функция cubic-bezier() позволяет задать собственную кривую ускорения через четыре числа. С ней можно сделать анимацию с эффектом инерции, лёгкого залипания при наведении или упругого отскока. Разбираем, как работают координаты управляющих точек и где это применяется: в модалках, карточках, галереях. #css #animation ⚡️ Читать статью