Розпродаж

Курс із CSS-анімацій, трансформацій та переходів

Оригінальна ціна: 990 грн.Поточна ціна: 390 грн.

-60%
Ви економите: 600 грн (60%)
До кінця акції:02дн02год58хв53сек

−20% при купівлі від 2 курсів — активується автоматично

Ваші сайти виглядають статичними та нудними, їм не вистачає динаміки сучасних веб-ресурсів? Знаючи основи CSS, ви все одно не можете додати інтерактивні ефекти, через що ваші проєкти програють у привабливості та не вражають користувачів. Цей курс навчить вас “оживляти” інтерфейси за допомогою CSS Transitions, 2D/3D Transformations та Animations, щоб створювати ефектні та незабутні сайти без єдиного рядка JavaScript.

Чому ви навчитеся
  • Створювати плавні переходи між станами елементів за допомогою CSS Transitions.
  • Застосовувати 2D та 3D трансформації (translate, scale, rotate, skew) для зміни форми та положення.
  • Розробляти складні багатокадрові анімації за допомогою @keyframes.
  • Комбінувати різні техніки для створення креативних та вражаючих веб-ефектів.
Для кого цей курс
  • Front-End розробники, які хочуть підвищити свою кваліфікацію.
  • Веб-дизайнери, які прагнуть самостійно реалізовувати анімаційні ефекти.
  • Верстальники, які хочуть додати інтерактивності у свої проєкти.
Вимоги
  • Впевнені знання HTML.
  • Базове володіння CSS (селектори, властивості).
  • Бажання творити та розвивати креативне мислення.
Курс містить

2 години відео

29 уроків

28 додаткових матеріалів

Дистанційно та у зручному для вас темпі

Повний довічний доступ

Цифровий сертифікат про закінчення

Add to Cart
CSS: Анимации, Трансформации и Переходы
Курс із CSS-анімацій, трансформацій та переходів
990 грн Оригінальна ціна: 990 грн.390 грнПоточна ціна: 390 грн.
Купівля займає хвилину
  1. Додаєте курс до кошика.
  2. Вводите пошту та пароль — це ваш акаунт, у ньому курс зберігатиметься постійно.
  3. Оплачуєте будь-яким зручним способом — їх понад вісім.
  4. Курс одразу відкривається в акаунті, посилання дублюється на пошту.

Доступ назавжди: повернутися до курсу можна й через рік. Питання — чат на сайті або info@siluette.com.ua.

Зверніть увагу: Цей курс представлений у форматі відеозаписів лекцій без зворотного зв’язку та участі викладача. Ви отримуєте повний доступ до всіх матеріалів одразу після оплати. Мова викладання — російська. Незабаром буде українська версія курсу.

Оживіть свої сайти за допомогою чистого 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

Відгуки покупців

  1. Ірина

    09.06.2025 Підтверджений клієнт

    Це просто знахідка для тих, хто хоче "оживити" свої сайти! Дуже багато красивих і незвичайних ефектів. Я в захваті!

  2. Максим

    17.09.2024 Підтверджений клієнт

    Для верстальників, які хочуть рости, - це обов'язково до вивчення. Допомагає робити сайти більш динамічними і цікавими.

  3. Юлія

    18.06.2024 Підтверджений клієнт

    3D-трансформації - це просто космос! Не думав, що таке можна робити на чистому CSS. Дуже круто.

Показано 3 із 3

Залишити відгук