3D-transform на примере переворота блока

В этом уроке вы научитесь переворачивать блоки на сайте при помощи CSS3.

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

В этом уроке мы будем использовать следующие свойства:
perspective – указывает перспективу (отдаление от экрана), задается родителю переворачивающегося блока. Если не задать – то будет просто плоская трансформация.
transform-style – включает 3D режим.
transform: rotateY – поворот по оси Y (можете попробовать поворачивать оп оси X самостоятельно)
backface-visibility – указывает, будет ли видна задняя сторона блока.

Картинка ROBO: https://yadi.sk/i/8pJMhT_4gHHi7

==============================================

*** Заработай на своем YouTube канале ***
http://master-css.com/go/21

Музыка предоставлена сайтом http://audiomicro.com, как партнеру VSP Group. Спасибо!
Наш сайт: http://master-css.com
Наш ВК: https://vk.com/m_css
Мой Twitter: https://twitter.com/SWAT727
Google+ https://plus.google.com/+Master-css/

ПРИСОЕДИНЯЙТЕСЬ
Поделиться

Master-CSS

Интересные уроки по созданию сайтов, WEB-дизайну, раскрутке и монетизации.



Обсуждение закрыто.