Существую CSS-свойства, которые используют изображения для создания фона элементов, создания рамок и масок «слоев», а также вырезки частей изображения. Применяя их, вы сможете добавлять изображения к элементам страницы и контролировать их положение и поведение.

Однако, существуют другие свойства, которые используются не так часто и применяются непосредственно к изображениям (тегу <img />). Использование тега является наиболее предпочтительными способом размещения изображений на страницах.

Предназначение указанных css свойств, применяемых к изображениям различное: от создания тени до увеличения резкости. Они помогают нам лучше контролировать положение и внешний вид изображений, добавляемых с помощью тега .

Давайте рассмотрим каждый из них подробнее.

В процессе верстки макетов, разработчик часто сталкивается со следующей проблемой: при недостаточном количестве контента, «подвал» отображается где-то по середине страницы.

Один из посетителей нашего сайта решил повторить эффект, который реализован на одной из страниц нашего сайта. Он заключается в том, что при наведении курсора мыши на изображение, картинка трансформируется и в нижней части изображения появляется подпись.

В этом уроке будет показано как при помощи CSS можно добиться такого же hover эффекта. Кроме того, будет рассказано как можно настроить анимацию под себя.

Полизаполнения (polyfills) – это решения на javaScript, имитирующие работу новых функций HTML5 в устаревших браузерах. В основном предназначаются для Internet Explorer старше 9-ой версий. Самым простым примером полизаполнения, который первым приходит в голову, является скрипт HTML5Shiv. Он обеспечивает возможность стилизации новых семантических HTML5 элементов ( <header>, <footer>, <article> и других) в устаревших версиях IE.