Стилизиране на изображения с CSS

В този урок ще разгледаме няколко CSS техники за оригиналния дизайн на изображения на сайта.

Изображенията, използвани в примерите, могат да бъдат изтеглени от тук.

1. Ефект на рамката на картината. Пример тук.

Html

CSS

2. Воден знак върху изображението. Пример тук.

Html

CSS

В този случай като воден знак е използвано следното изображение.

3. Надпис на изображението. Пример тук.

Html

CSS

Надявам се, че тези начини за декориране на снимки ще ви бъдат полезни при дизайна на вашия сайт!

Този урок е подготвен за вас от екипа на ruseller.com

Източник на урока: www.sohtanaka.com
Превод: Сергей Патин
Създаден урок: 3 април 2009 г.
Преглеждания: 69278
Правила за повторно отпечатване

5 най-нови CSS урока

Забавни буквени ефекти

Малък ефект с интерактивна анимация на букви.

Прилагане на забавни подсказки

Малка концепция за забавни съвети, внедрени в SVG и anime.js. В допълнение към специалния стил, примерът изпълнява анимация и трансформация на графични обекти.

Анимирани букви

Експеримент: Анимирани SVG писма, базирани на библиотеката Anime.js.

Слънчеви очила от първо лице

Готин експеримент с уеб страница, показваща се от първо лице през слънчеви очила.

Падаща навигация

Експериментален скрипт за навигационно падащо меню.