ЗАКАЗorder-icon

Коллекция красивых CSS эффектов

Назначение и возможности CSS3

В WEB принято отделять представление страницы от ее содержания. Внешний вид страницы описывается с помощью специального языка разметки CSS (Cascading Style Sheets — каскадные таблицы стилей). Технология CSS стандартизирована и одобрена консорциумом W3C. Создавая различные таблицы стилей для различых представлений одного документа на разных устройствах (экранах мобильных и больших мониторах, версии для печати) нет необходимости каждый раз править содержание страницы. Использование страниц стилей ускоряет общую скорость загрузки страницы потому что большинством браузеров стили кэшируется, а некоторым посетителям (например поисковым роботам) они могут быть не нужны.

Стандарт CSS использовался и развивался с 1990-х и прошел три поколения. Последняя версия стандарта - CSS3, в нее добавились новые возможности по созданию теней, градиентов и простой анимации без использования java script.

Примеры CSS3

Все нижеприведенные CSS эффекты были скопированы мной из различных источников в которых подробно показано как они создавались.

3D Responsive Touch Slider Using Html CSS & Swiper.js

Slide One

bla-bla-bla - 1

read more

Slide Two

bla-bla-bla - 2

read more

Slide Three

bla-bla-bla - 3

read more
скопировано с https://www.youtube.com/watch?v=tfrXTp8muUw&feature=youtu.be

loading animation

Loading...
скопировано с https://youtu.be/QLiZ5VrhA98

layered image hover effect

скопировано с https://youtu.be/xtrYklakUIk

Creative button animation effect

скопировано с https://youtu.be/w0V4HAYYCbU

Выводы CSS3

С помощью SS3 можно действительно очень красиво оформить web-станицу и добавить на нее анимацию.