Научитесь создавать кнопки со сложными анимационными эффектами в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/127

Вы разберётесь, как использовать CSS-трансформации, тени и плавные переходы для создания иллюзии подъёма и вращения при наведении.

#туториалотhtmlacademy

Узнайте, как работать с 3D-трансформациями и создайте анимированный куб в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/129

Вы разберётесь, как использовать 3D-трансформации, увидите, какой эффект дают свойства perspective и backface-visibility, поймёте принцип работы множественных трансформаций.

#туториалотhtmlacademy

Через час, в 19:00, начнётся лайв с компанией Максимум про обучение напрямую для работодателя.

Приходите на лайв, чтобы подробнее узнать о компании и программах обучения. Записаться на лайв можно по ссылке

https://htmlacademy.ru/events/live_maximum

Начался лайв с компанией Максимум про обучение напрямую для работодателя

Присоединяйтесь по ссылкам:
ВК — https://vk.com/video-38306835_456239509
Ютюб — https://www.youtube.com/live/sbN8jysfjbE

Создайте интерактивный индикатор для поля ввода на JavaScript в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/131

#туториалотhtmlacademy

Заглянем в будущее и узнаем, как на чистом CSS создавать анимации, управляемые прокруткой в новом бесплатном курсе.

https://htmlacademy.ru/demos/133

Мы создадим индикатор прочтения статьи без всякого JavaScript, с помощью scroll-timeline. Это новейшая технология, которая есть ещё не во всех браузерах. Рекомендуем смотреть демонстрацию в Chrome.

#туториалотhtmlacademy

Научитесь создавать круговые диаграммы с помощью конических CSS-градиентов в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/135

Помимо конических градиентов вы узнаете как использовать CSS-маски для вырезания прозрачных областей в элементах и создадите круговую диаграмму-бублик.

#туториалотhtmlacademy

Создадим адаптивную галерею с "резиной" и фиксированными пропорциями изображений в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/137

Вы познакомитесь со свойствами aspect-ratio и object-fit, а также поэкспериментируете с адаптивностью от контейнера, Container Queries.

#туториалотhtmlacademy

Научитесь создавать цветовые темы и реализовывать их переключение на чистом CSS в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/139

Ключевую роль в этой технике играют :has и CSS-переменные.

#туториалотhtmlacademy

Научитесь создавать прилипающие блоки aka «sticky headers» в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/141

Это хрестоматийный пример использования position: sticky.

#туториалотhtmlacademy

С 4 по 10 ноября HTML Academy вместе с партнёрами-работодателями открывает доступ ко всем тренажёрам

https://htmlacademy.ru/special/open-week/2024/november

Зарабатывайте баллы за прохождение тренажёров и приглашение друзей. Самые активные участники получат бесплатные места на совместных программах обучения.

Правила акции читайте тут:
https://htmlacademy.ru/docs/action/open-week

Визуализация математических CSS-функций

https://htmlacademy.ru/demos/143

В этой интерактивной визуализации мы познакомимся с математическими CSS-функциями, порисуем графики, повспоминаем линейную алгебру. Кстати, визуализация тоже сделана на чистом CSS.

#туториалотhtmlacademy

Научитесь верстать адаптивное оглавление в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/145

Изюминка этого компонента — сложные «точки-заполнители», которые отлично отображаются в любых условиях. Ключевую роль в реализации эффекта играют тонкости абсолютного позиционирования.

#туториалотhtmlacademy

Научитесь создавать вращающийся лоадер и использовать CSS-переменные для кардинального сокращения и упрощения стилей в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/147

#туториалотhtmlacademy

Идёт набор на совместную программу обучения для компании Максимум:
— Обучение напрямую для работодателя
— Малая группа — 10 человек
— Старт — 11 ноября

Подробности программы и запись по ссылке:
https://tml.io/frontmaximum

В рубрике «сегодня я узнал» прекрасная история про таинственный третий регистр текста, или почему по строке mad в венгерском нельзя найти строку madzag.

https://habr.com/ru/articles/856784/

Создайте анимированный индикатор загрузки с эффектом пульсации в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/149

Лоадер реализован с помощью единственного тега и линейных градиентов.

#туториалотhtmlacademy

Создайте галерею с красивейшим скользящим эффектом при наведении в новом бесплатном курсе. Наглядно, интерактивно, без воды.

https://htmlacademy.ru/demos/151

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

#туториалотhtmlacademy