CSS3 #17 Трансформации (Transform)

#YauhenK #webDev #CSS #CSS3
Всех приветствую в курсе «CSS3».
В данном видеокурсе мы с вами рассмотрим CSS, или каскадных таблиц стилей. Начнём с основ: простые и составные селектора, псевдоклассы и псевдоэлементы, позиционирование, блочная модель и т.д. А так же разберём свойства добавленные в третьей версии спецификации: границы и скругления, тени, градиенты, фильтры, трансформации, анимации, плавные переходы и т.д. По окончанию курса вы получите отличную теоретическую базу для создания полноценных статичных веб-страниц.
✒ Репозиторий курса:
✔ github.com/YauhenKavalchuk/css3
✒ Полный список готовых и планируемых курсов:
✔ Trello: trello.com/b/R6rD7qq8
✒ Автор курса:
✔ KZbin: / yauhenkavalchuk
✔ Instagram: / yauhenkavalchuk
✔ Twitter: / yauhenkavalchuk
✔ VK: YauhenKavalchuk
✔ LinkedIn: / yauhenkavalchuk
✔ GitHub: github.com/YauhenKavalchuk
✔ VK (Группа): webdevcom
✒ Поддержать развитие канала: github.com/YauhenKavalchuk/yo...

[@EugenySubbotin]

Наконец-то я нашел хорошие примеры использования трансформации. Шикарный урок!

[@YauhenKavalchuk]

Спасибо

[@eclipseweb1419]

Cпасибо большое! Коротко и супер понятно, сразу закрепил все знания. Благодарю!

[@YauhenKavalchuk]

Пожалуйста

[@olehyefimenko6693]

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

[@YauhenKavalchuk]

Пожалуйста

[@zeleny777leon777]

Узнал для себя новое! Женя, спасибо не бросай.

[@YauhenKavalchuk]

Рад, что помогло)

[@leader7700]

Смотрел видео недавно про опенкарт и там как будто робот читает с листа. Очень сложно воспринимается. А этот подкаст по верстке смотрю на одном моменте - все легко просто, на слух приятно и понятно. Спасибо большое. И что знал либо вспомнил либо расширил кругозор и новое узнал!

[@YauhenKavalchuk]

Спасибо большое за отзыв)

[@sergkuznetzov3469]

Спасибо , Евгений!

[@YauhenKavalchuk]

Пожалуйста

[@user-ljugigyifg]

Очень полезное видео. Спасибо!

[@YauhenKavalchuk]

Спасибо)

[@jahongirmusayev658]

Спасибо большое! Отличное объяснение.

[@YauhenKavalchuk]

Пожалуйста

[@polskolg]

Очень красивый эффект получился с transform: scale()

[@YauhenKavalchuk]

Рад, что понравилось

[@romanrodin4082]

спасибо, все понятно и в полном объеме

[@YauhenKavalchuk]

Пожалуйста

[@user-cd1sr5sx2r]

Спасибо за хороший урок.

[@YauhenKavalchuk]

Пожалуйста

[@rimavedeckiene2203]

Very interesting and magic things. Thanks

[@YauhenKavalchuk]

You’re welcome

[@mukhammadalirakhmatullayev1950]

Спасибо огромное очень полезное видео🎉🎉🎉

[@YauhenKavalchuk]

Пожалуйста

[@user-jr2qd7wz4k]

очень понятно спасибо за урок😀

[@YauhenKavalchuk]

Всегда пожалуйста

[@SsanchesS]

Самое понятное объяснение. Спасибо!

[@YauhenKavalchuk]

Пожалуйста

[@user-km9yo3di6y]

Офигенно. Спасибо

[@YauhenKavalchuk]

Пожалуйста

[@demidronder]

Очень полезный контент

[@YauhenKavalchuk]

Спасибо

[@ridl27]

четко

[@YauhenKavalchuk]

Круто)

[@HA_CTPIME]

👍👍👍

[@YauhenKavalchuk]

👍

[@agilkerimov]

спасибо

[@YauhenKavalchuk]

Пожалуйста

[@user-yn5xq1iu2y]

👍👍👍👍👍👍👍👍👍👍👍

[@YauhenKavalchuk]

👍

[@oleksiikorolenko5528]

Женя, спасибо за видео. Все понятно и доступно. У меня вопрос, а почему может transition не применяться при расHOVERе?

[@YauhenKavalchuk]

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

[@Hurep]

Спасибо за гайд, наконец-то разобрался! Но ещё одна проблема-как сделать так чтобы когда курсор отводился от картинки она оставалась в том же положении?

[@YauhenKavalchuk]

Здесь нужно использовать анимации, а не трансформации

[@My-video123]

не видно в цсс где отцентрирована картинка в диве. или я не заметил(

[@YauhenKavalchuk]

В описании есть ссылка на репозиторий курса, можете там посмотреть

[@vatasi7312]

А что делать если transform добавил отступы ?

[@YauhenKavalchuk]

Это свойство не добавляет отступы

[@mrakov]

Ничего не сказал про потерю фокуса картинки про scale(

[@YauhenKavalchuk]

Вы имеете ввиду резкость и чёткость изображения? Ну, это происходит при любых CSS трансформациях

[@alexandrkhutornoy]

Насчет rotate ты не прав поворот может быть в два направления

[@YauhenKavalchuk]

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