Оживите ваши сайты с помощью чистого CSS!
Научитесь создавать впечатляющие анимации и интерактивные эффекты, которые сделают ваши сайты более привлекательными и профессиональными. Этот курс предназначен для тех, кто уже знаком с HTML и CSS, и хочет выйти на новый уровень, овладев мощными инструментами для веб-анимации без использования JavaScript.
Что вы найдете внутри курса?
Курс структурирован таким образом, чтобы последовательно провести вас от самых простых эффектов до сложных анимаций. Мы подробно разберем три кита современной CSS-анимации, закрепляя каждую тему на практических примерах и специально подготовленных демонстрациях.
Основные модули курса:
- CSS Переходы (Transitions): Научитесь создавать плавные эффекты при изменении свойств элементов, например, при наведении курсора. Подробно разберем свойства transition-duration, transition-delay, transition-property и другие.
- CSS Трансформации (Transformations): Освоите 2D и 3D трансформации. Вы сможете перемещать (translate), масштабировать (scale), вращать (rotate) и наклонять (skew) элементы, а также работать с перспективой в 3D-пространстве.
- CSS Анимации (Animations): Погрузитесь в мир многокадровых анимаций с помощью @keyframes. Изучите, как управлять итерациями, направлением, задержкой и другими параметрами для создания сложных анимационных сценариев.
Пройдя этот курс, вы сможете добавить динамики и креативности в свои проекты, значительно повысив их качество и привлекательность для пользователей.
? Подробная программа курса
1. CSS – Переходы
- Свойство: transition-duration
- Свойство: transition-delay
- Свойство: transition-property
- Свойство: transition-timing-function
- Сокращенное свойство: transition
2. CSS – Трансформации
- 2D-функции: translate(), scale(), rotate(), skew()
- Свойство: transform-origin
- 3D-трансформации: перемещение и вращение в 3D
- Свойства: perspective, perspective-origin, backface-visibility
3. CSS – Анимации
- Создание анимации с помощью @keyframes
- Свойство: animation-iteration-count
- Свойство: animation-delay
- Свойство: animation-direction
- Свойство: animation-fill-mode
- Свойство: animation-play-state
- Сокращенное свойство: animation
Отзывы покупателей
08.03.2025 Подтвержденный клиент
Это просто находка для тех, кто хочет "оживить" свои сайты! Очень много красивых и необычных эффектов. Я в восторге!
23.02.2025 Подтвержденный клиент
3D-трансформации - это просто космос! Не думал, что такое можно делать на чистом CSS. Очень круто.
03.04.2024 Подтвержденный клиент
Для верстальщиков, которые хотят расти, - это обязательно к изучению. Помогает делать сайты более динамичными и интересными.