Резиновый блок DIV с закруглёнными углами тенью и фоном картинкой
Стильный резиновый блок DIV с закруглёнными углами тенью и фоном картинкойПредставляю Вашему вниманию готовое решение - резиновый блок с закруглёнными углами, тенью и всем чем хотите свёрстаный DIVами. Так как поддержки CSS3 можно дождаться не скоро - такие альтернативные решения незаменимы. С помощью CSS3 такой блок можно будет реализовать всего одним DIVом. Обшарив просторы инета я не нашёл ниодного способа реализации такого сложного оформления блока лучшего чем этот(лучше только таблицей). Фон блока задан картинкой - картинка центрального фона позволяет не зависеть от использования безопасных цветов и позволяет использовать любые цвета блока какие только придумаете. Данная реализация имеет свои недостатки: это использование девяти DIVов, использование девяти картинок, невозможность использования картинок с прозрачным фоном для оформления блока, так как картинки углов накладываются на картинки сторон и, через прозрачный фон углов будут видны картинки сторон, из-за этого цвет фона картинок блока зависит от фона сайта. Но, несмотря на недостатки - выглядит блок очень эффектно!
В архив вкладываю PSD исходник для редактирования блока под свой дизайн.
Смотреть пример резиновый блок DIV с закруглёнными углами и фоном картинкой
Скачать готовый пример резиновый блок DIV с закруглёнными углами и фоном картинкой
Пользуемся на здоровье!
Не забываем комментировать.
Понравилась новость Резиновый блок DIV с закруглёнными углами тенью и фоном картинкой на MegaWeb.su? Сохрани в закладках или распечатай!
Информация
Если копируете мой материал - будьте добры оставлять ссылку на источник MegaWeb.su пожалуйста, или поставьте на свой сайт мою кнопочку.
Уважайте чужой труд! И Вам хорошо - и мне приятно, это стимулирует дальнейшее развитие проекта!
Другие новости по теме
Обратите внимание, возможно Вас заинтересуют другие публикации, похожие на Резиновый блок DIV с закруглёнными углами тенью и фоном картинкой из категории Основы / Шаблоны
- Меню навигации ⋙ CSS3 увеличение картинки при наведении
- Меню навигации ⋙ Выезжающее CSS3 меню
- Меню навигации ⋙ Простое круглое меню на CSS с описанием категории при наведении на иконку
- Меню навигации ⋙ Стильное необычное очень красивое круглое CSS меню для сайта в виде пчелиных сот
- Основы / CSS ⋙ Обзор основных CSS3 свойств Меню аккордеон на CSS3 вертикальное
- Магия ЯваСкрипт / jQuery ⋙ Tooltip для увеличения картинки на jQuery
- Магия ЯваСкрипт / jQuery ⋙ Плавное увеличение картинки при наведении на jQuery
- Основы / Шаблоны ⋙ Резиновая таблица с закруглёнными углами и тенью
- Основы / Шаблоны ⋙ Блок DIV с закруглёнными углами и тенью с помощью CSS3
- Советы ⋙ Блок Предупреждение для Internet Explorer 6
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
