Результаты поиска
Введите запрос, по завершению нажмите Enter.
ФорумБлогиМануалыНовые постыЛюди
  • Страница 1 из 1
  • 1
Форум » Веб-мастерская » CSS » Помогите плиззз!!! (Описание фото на полоске)
Помогите плиззз!!!
Отправлено 29.04.2012 - 09:071
Нет аватара
Пользователь
70 сообщений
Мужчина
Полоска на фото с текстом
Профиль Личное сообщение Дом. страница icq Skype
19
Отправлено 29.04.2012 - 09:222
Пользователь
224 сообщения
Мужчина
Вот изображения с такой полоской

Code
<div style="border:4px solid #1f5eb9; align: top;display:inline-block;position:relative;"><img alt="$TITLE$" title="$TITLE$" src="$IMG_URL1$" width="ширина изображения" height="высота изображения">
<div style="position:absolute;bottom:0;left:0;background: rgba(0,0,0,0.8);color: #fff;padding: 5px 7px;text-align:left;line-height: 10px;font-weight: normal;font-size:10px;">ТЕКСТ</div>
</div>


что по чем:
1. border:4px solid #1f5eb9;
border - обводка, рамка
4px - толщина рамки
solid #1f5eb9; - задаем цвет обводки (в нашем случае синий)

2. background: rgba(0,0,0,0.8); - фон самой рамки
3. color: #fff; - цвет текста в рамке.

думаю все что нужно объяснил )
Профиль Личное сообщение Дом. страница icq Skype
3
Отправлено 29.04.2012 - 10:553
Нет аватара
Пользователь
70 сообщений
Мужчина
Спасибо! А для это рамке как сделать? Такую полоску
Code
<img src="ССЫЛКА ФОТО" alt="" align="left" style="float:left;width:200px;height:120px;background:#F5F5F5;padding:5px!important;margin-right:10px!important;outline:1px solid #D0D0D0;border:1px solid #fff!important ">


Добавлено (29.04.2012, 10:55)
---------------------------------------------
И чтобы полоска была на фото, а не на рамке...
Профиль Личное сообщение Дом. страница icq Skype
19
Отправлено 29.04.2012 - 11:074
Пользователь
224 сообщения
Мужчина
Ronaldo, тот пример что я дал полоска на фотке а не на рамке. Рамка на все фотке
Профиль Личное сообщение Дом. страница icq Skype
3
Отправлено 30.04.2012 - 03:365
Нет аватара
Пользователь
70 сообщений
Мужчина
Quote (ololowka)
Ronaldo, тот пример что я дал полоска на фотке а не на рамке. Рамка на все фотке

да я видел... просто мне надо, чтобы эта полоска была на этой рамке вот:

Code
<img src="ССЫЛКА ФОТО" alt="" align="left" style="float:left;width:200px;height:120px;background:#F5F5F5;padding:5px!important;margin-right:10px!important;outline:1px solid #D0D0D0;border:1px solid #fff!important ">


также на фото только рамка была эта...
Сделайте пожалуйста кто сможет, буду очень благодарен!

Добавлено (29.04.2012, 18:57)
---------------------------------------------
Ребята ну сделайте пожалуйста no

Добавлено (30.04.2012, 03:36)
---------------------------------------------

http://imageshack.us/photo/my-images/10/52407127.png/

Вот так должна выглядеть она
Профиль Личное сообщение Дом. страница icq Skype
19
Отправлено 30.04.2012 - 06:196
uSite Team
1689 сообщений
Мужчина
Code
<div class="articleimg" style="position:relative; display:inline-block;">
<div style="position:absolute; bottom:6px; left:0px; background:#000000; opacity:0.8; color:#ffffff; padding:2px 6px 3px 6px; margin-left:3px; border-radius:3px;">Ля ля ля тополя</div>
<img src="Ссылка на изображение" alt="" />
</div>
background:#000000 - цвет фона
opacity:0.8 - непрозрачность, т.е. видимость на 0.8 или 80%
color:#ffffff - цвет текста
padding:2px 6px 3px 6px - отступы внутри рамки (сверху 2px, справа 6px, снизу 3px, слева 6px)
margin-left:3px - внешний отступ от левого края изображения до левого края рамки
border-radius:3px - закругление улгов рамки, радиус - 3px
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 30.04.2012 - 06:517
Нет аватара
Пользователь
70 сообщений
Мужчина
PhoEn-X, спасибо тебе... слов нет

А можно сделать чтобы эта фотография была в этой рамке :

Code
<img src="ССЫЛКА ФОТО" alt="" align="left" style="float:left;width:200px;height:120px;background:#F5F5F5;padding:5px!important;margin-right:10px!important;outline:1px solid #D0D0D0;border:1px solid #fff!important ">
Профиль Личное сообщение Дом. страница icq Skype
19
Отправлено 30.04.2012 - 07:488
uSite Team
1689 сообщений
Мужчина
Лучше изображением сделай)) а то я не пойму, в какой рамке.
Профиль Личное сообщение Дом. страница icq Skype
709
Отправлено 30.04.2012 - 10:099
Нет аватара
Пользователь
70 сообщений
Мужчина
Code
Да вот код рамки <img src="ССЫЛКА ФОТО" alt="" align="left" style="float:left;width:200px;height:120px;background:#F5F5F5;padding:5px!important;margin-right:10px!important;outline:1px solid #D0D0D0;border:1px solid #fff!important ">


а вот чтобы такой был вид

Профиль Личное сообщение Дом. страница icq Skype
19
Форум » Веб-мастерская » CSS » Помогите плиззз!!! (Описание фото на полоске)
  • Страница 1 из 1
  • 1
Поиск:
uSite.su © 2010-2025
Все права защищены.
Многогранность и сверхспособности сообщества uCoz заставляют задуматься даже самые стойкие умы веб-программирования, ведь лишь uSite способен предоставить ответы на самые сложные вопросы uCoz.
01RSS
Хостинг от uCozПользовательское соглашение и прочая информация