Навигация
Категории
| Скрипты для Ucoz [474] |
| Шаблоны для Ucoz [199] |
| Графика для Ucoz [11] |
| Скрипты Меню для сайта [21] |
| Ajax Окна [4] |
Мини-Чат
Опрос
Лучшие пользователи
Ник: Толик
Файлов: 744
Ник: cyber
Файлов: 159
Ник: waxirewion
Файлов: 59
Ник: Admin™
Файлов: 5
Партнеры
Статистика
Онлайн всего: 1
Гостей: 1
Пользователей: 0
| Главная » Файлы » Всё для Ucoz » Скрипты для Ucoz |
Картинка с описанием на странице контента uCoz
Нам необходимо на странице с контентом, в нужное место установить контейнер div, в который мы помещаем ссылку на изображение и тег span, в котором прописываем комментарий к изображению:
Теперь всё, что нам необходимо, так это прописать нужные css стили нашему html шаблону выше:
Обратите внимание, что в данном примере, контейнер div будет размещён с правой стороны вашего контента, для отображения с левой стороны контента, вам необходимо установить этот стиль:
На этом всё, спасибо за внимание ! В самом начале где в коде картинка "http://3week.clan.su/img7/CrimsonDragon_screen.jpg" вы должны заменить на свою !!!
Code
<div class="content_img">
<img alt="пример новости в демо" title="картинка новости "src="http://3week.clan.su/img7/CrimsonDragon_screen.jpg">
<span>описание картинки</span>
</div>
<img alt="пример новости в демо" title="картинка новости "src="http://3week.clan.su/img7/CrimsonDragon_screen.jpg">
<span>описание картинки</span>
</div>
Теперь всё, что нам необходимо, так это прописать нужные css стили нашему html шаблону выше:
Code
/* Описание под картинкой
------------------------------------------*/
.content_img {
width:160px;
float:right;
display:block;
text-align:center;
background: #f6f6f6;
outline: 1px solid #D0D0D0;
border: 1px solid #fff;
padding: 5px 5px 5px 5px;
margin: 0px 2px 5px 20px;
}
.content_img img {
margin: 3px 0px 3px 0px;
}
.content_img span {
color:#777;
font: 10px Verdana,Arial,Helvetica, sans-serif;
text-shadow: 1px 1px 1px #fff;
}
------------------------------------------*/
.content_img {
width:160px;
float:right;
display:block;
text-align:center;
background: #f6f6f6;
outline: 1px solid #D0D0D0;
border: 1px solid #fff;
padding: 5px 5px 5px 5px;
margin: 0px 2px 5px 20px;
}
.content_img img {
margin: 3px 0px 3px 0px;
}
.content_img span {
color:#777;
font: 10px Verdana,Arial,Helvetica, sans-serif;
text-shadow: 1px 1px 1px #fff;
}
Обратите внимание, что в данном примере, контейнер div будет размещён с правой стороны вашего контента, для отображения с левой стороны контента, вам необходимо установить этот стиль:
Code
/* Описание под картинкой
------------------------------------------*/
.content_img {
width:160px;
float:left;
display:block;
text-align:center;
background: #f6f6f6;
outline: 1px solid #D0D0D0;
border: 1px solid #fff;
padding: 5px 5px 5px 5px;
margin: 0px 20px 5px 0px;
}
.content_img img {
margin: 3px 0px 3px 0px;
}
.content_img span {
color:#777;
font: 10px Verdana,Arial,Helvetica, sans-serif;
text-shadow: 1px 1px 1px #fff;
}
------------------------------------------*/
.content_img {
width:160px;
float:left;
display:block;
text-align:center;
background: #f6f6f6;
outline: 1px solid #D0D0D0;
border: 1px solid #fff;
padding: 5px 5px 5px 5px;
margin: 0px 20px 5px 0px;
}
.content_img img {
margin: 3px 0px 3px 0px;
}
.content_img span {
color:#777;
font: 10px Verdana,Arial,Helvetica, sans-serif;
text-shadow: 1px 1px 1px #fff;
}
На этом всё, спасибо за внимание ! В самом начале где в коде картинка "http://3week.clan.su/img7/CrimsonDragon_screen.jpg" вы должны заменить на свою !!!
| Всего комментариев: 0 | |