Графическая рамка вокруг картинки

Сообщений: 52 Регистрация: Апр 2012

14 Августа 2012 21:39

Здравствуйте, форумчане!
Возникла такая проблема при создании дизайна фотогалереи:
Сделать фотогалерею. Для придания эффекта думаю сделать всем фото рамку под дерево. Редактировать каждое фото и накладывать на него рамку - лень. Сделал следующее: при выгрузке фото на сервер у него изменяются размеры. Пропорции изображения сохраняются относительно высоты (высота равна 500 пикселей, ширина разная).
Как при помощи CSS к фото можно прикрутить графическую рамку?

Евгений

Сообщений: 436 Регистрация: Окт 2010

14 Августа 2012 22:04

легко, для этого достаточно написать в css такой блок

Код
img { border: 1px solid #E3DFDF; border-radius: 15px; display: block; }

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

Антон

Сообщений: 52 Регистрация: Апр 2012

15 Августа 2012 14:06

Цитата

Евгений пишет:
легко, для этого достаточно написать в css такой блок

Код
img { border: 1px solid #E3DFDF; border-radius: 15px; display: block; }

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

Я про это уже знал, не совсем то, что нужно. Но все идеи которые я пытался реализовть непрокатили( придется пользоваться, скорее всего этим кодом

Kolobochek

Сообщений: 1454 Регистрация: Апр 2012

15 Августа 2012 21:00

Я конечно не гуру в ЦСС, но кажется тут без позиционирования не обойтись (css - position), если я вас правильно понял, вам нужно что-то такое _kinoman.ru_ (пример своебразной рамки/обложки ДВД), посмотрите на коды через файребуг

В наличии свежие инвайты на завод

YesMan Сообщений: 260 Регистрация: Июн 2011	#5 20 Августа 2012 19:36 Антон, подготовьте изображения для всех частей рамки: для левой, для центральной и для правой (или для верхней, центральной и нижней). Используйте их как фоновое изображение для блоков. Центральная часть должна увеличиваться в зависимости от ширины фото, для этого в css примените свойство background-repeat.

Новые темы	Объявления	Свободное общение
15:49 Новая поисковая система от OpenAI 14:42 2Index - быстрая индексация страниц сайта и обратных ссылок 09:30 Fraud.Hosting: надёжная защита от недобросовестных клиентов 09:26 Ворд Пресс (или его шаблон) перестал отображать <b> болд жирный 09:19 Rutube запустил «Новая система монетизации для блогеров» 23:34 С наступающим Новым годом! АП Яндекс ИКС 23.12.2025 23:07 Как Яндекс индексирует ваш сайт? \| АПдейт выдача 8.12.2025	14:34 Продвижение Яндекс подсказок от hoopbots 14:32 PonyBit.ru - обменный пункт PonyBit.ru (Понибит.ру) 14:31 Почему клиенты выбирают TriRublya 14:11 Продам аккаунты Gmail USA IP \| Gmail MIX IP \| Outlook Old 13:50 Почему клиенты выбирают TriRublya 13:42 Почему клиенты выбирают TriRublya 13:33 Мобильные и Резидентные Прокси Для Соц Сетей \| 3 Гб Бесплатно	11:13 С юмором по жизни! 22:59 Про мясо 15:07 Добро пожаловать в цифровой мир... 22:12 BYTIK.shop – сервис по продвижению в популярных социальных сетях 10:10 накрутка трафика в SimilarWeb 16:50 Компьютерная мышь 23:03 Точные прогнозы на футбол

Новые темы

Объявления

Свободное общение

15:49 Новая поисковая система от OpenAI
14:42 2Index - быстрая индексация страниц сайта и обратных ссылок
09:30 Fraud.Hosting: надёжная защита от недобросовестных клиентов
09:26 Ворд Пресс (или его шаблон) перестал отображать <b> болд жирный
09:19 Rutube запустил «Новая система монетизации для блогеров»
23:34 С наступающим Новым годом! АП Яндекс ИКС 23.12.2025
23:07 Как Яндекс индексирует ваш сайт? | АПдейт выдача 8.12.2025

14:34 Продвижение Яндекс подсказок от hoopbots
14:32 PonyBit.ru - обменный пункт PonyBit.ru (Понибит.ру)
14:31 Почему клиенты выбирают TriRublya
14:11 Продам аккаунты Gmail USA IP | Gmail MIX IP | Outlook Old
13:50 Почему клиенты выбирают TriRublya
13:42 Почему клиенты выбирают TriRublya
13:33 Мобильные и Резидентные Прокси Для Соц Сетей | 3 Гб Бесплатно

11:13 С юмором по жизни!
22:59 Про мясо
15:07 Добро пожаловать в цифровой мир...
22:12 BYTIK.shop – сервис по продвижению в популярных социальных сетях
10:10 накрутка трафика в SimilarWeb
16:50 Компьютерная мышь
23:03 Точные прогнозы на футбол

16.08.2018 08:11	Рамка в углах
08.08.2011 21:53	Исчезла рамка вокруг поля комментариев