Перейти к содержимому


× Быстрый вопрос
Пользователь месяца
dos1k dos1k 1-й за Май
Очков активности: 1 194 28 тем, 115 сообщений, 4 балла репутации
Сайт: dos1k.ru
ТОП самых активных за этот месяц
  • Фотография Olya23
    #1

    Olya23
    Очков активности: 678 3 темы, 104 сообщения, 4 балла репутации

  • Фотография Rodiola
    #2

    Rodiola (rukodelkovo.ru)
    Очков активности: 414 0 тем, 69 сообщений, 4 балла репутации

  • Фотография maxnik
    #3

    maxnik (konovalovpavel.ru)
    Очков активности: 81 0 тем, 18 сообщений, 3 балла репутации

  • Фотография agrx
    #4

    agrx (key-assort.ru)
    Очков активности: 51 0 тем, 17 сообщений, 2 балла репутации

  • Фотография BLIK
    #5

    BLIK
    Очков активности: 40.5 Вне конкурса за определение пользователя месяца

  • Фотография fedornabilkin
    #6

    fedornabilkin (plohoneponyal.ru)
    Очков активности: 39 0 тем, 13 сообщений, 2 балла репутации

  • Фотография re-search
    #7

    re-search
    Очков активности: 36 5 тем, 9 сообщений, 1 балл репутации

  • Фотография Андрей WPMasterKZ
    #8

    Андрей WPMasterKZ (wpmaster.kz)
    Очков активности: 36 0 тем, 24 сообщения, 1 балл репутации

  • Фотография Ixman
    #9

    Ixman (o5cat.ru)
    Очков активности: 24 0 тем, 8 сообщений, 2 балла репутации

  • Фотография Artos
    #10

    Artos
    Очков активности: 21 0 тем, 7 сообщений, 2 балла репутации

  • Показать весь ТОП 10
Поддержите форум! =)
Апдейты
  • Яндекс ИКС: 24.05.2019
  • Яндекс выдача: 12.06.2019
Топ 5 участников по репутации


Описание изображения caption

#1 sol

sol
  • Неактивные
  • 19 сообщений
  • Репутация: 0
0

Отправлено 07 Май 2009 - 15:38

Описание изображения:

HTML:

<div class="img-desc">
  <img src="sample.jpg" width="575" height="335" alt="" />
  <cite>Salone del mobile Milano, April 2008 - Peeta</cite>
</div>

CSS:

.img-desc{
  position: relative;
  display: block;
  width: 575px;
  height:335px
}
.img-desc cite{
  background: #111;
  filter:alpha(opacity=55);
  opacity:0.55;
  color: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 555px;
  padding: 10px;
  border-top: 1px solid #999
}

пример http://www.sohtanaka...dow/caption.htm


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

p.s. путь к css прописан 100% верно

 

 

  • 0

#2 ZiTosS

ZiTosS
  • Неактивные
  • 5 148 сообщений
  • Репутация: 8

Отправлено 07 Май 2009 - 18:29

sol, print-screen в студию. А так же код HTML приложите полный. Я вставил ваш код в один цельный HTML. Всё работает нормально
<html>
<head>
<style type="text/css">
.img-desc{
position: relative;
display: block;
width: 575px;
height:335px
}
.img-desc cite{
background: #111;
filter:alpha(opacity=55);
opacity:0.55;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
width: 555px;
padding: 10px;
border-top: 1px solid #999
}
</style>
</head>
<body>
<div class="img-desc">
<img src="sample.jpg" width="575" height="335" alt="" />
<cite>Salone del mobile Milano, April 2008 - Peeta</cite>
</div>
</body>
</html>

  • 0

#3 sol

sol
    Topic Starter
  • Неактивные
  • 19 сообщений
  • Репутация: 0

Отправлено 07 Май 2009 - 21:58

Все решил. спасибо
  • 0

#4 sol

sol
    Topic Starter
  • Неактивные
  • 19 сообщений
  • Репутация: 0

Отправлено 08 Май 2009 - 02:25

одна проблема ушла, другая пришла ))))))))
помогите пожалуйста....


хтмл

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="css.css" />
</head>
<body>
<div id="content">
<table class="table">
<tr>
<td ><a href="#"></a><img src="img/1.jpeg" class="img-desc"><cite>Подпись</cite></td>
<td ><a href="#"></a><img src="img/2.jpeg" class="img-desc"><cite>Подпись</cite></td>
<td ><a href="#"></a><img src="img/3.jpeg" class="img-desc"><cite>Подпись</cite></td>
<td rowspan="2"><a href="#"></a></td>
</tr>
<tr>
<td ><a href="#"></a><img src="img/4.jpeg" class="img-desc"><cite>Подпись</cite></td>
<td ><a href="#"></a><img src="img/5.jpeg" class="img-desc"><cite>Подпись</cite></td>
<td ><a href="#"></a><img src="img/6.jpeg" class="img-desc"><cite>Подпись</cite></td>
</tr>
</table>
</div>
</body>
</html>

css
.img-desc{
position: relative;
display: block;
width: 180px;
height:237px
}
.img-desc cite{
background: #111;
filter:alpha(opacity=55);
opacity:0.55;
color: #fff;
position: absolute;
bottom: 0;
left: 0;
width: 180px;
padding: 10px;
border-top: 1px solid #999;
}

Почему не отображается как в примере http://www.sohtanaka...dow/caption.htm
  • 0

#5 ZiTosS

ZiTosS
  • Неактивные
  • 5 148 сообщений
  • Репутация: 8

Отправлено 08 Май 2009 - 17:46

Так не будет работать... Вот так будет :P
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="css.css" />
</head>
<body>
<div id="content">
<table class="table">
<tr>
<td ><div class="img-desc"><img src="img/1.jpeg"><cite>Подпись</cite></div></td>
<td ><div class="img-desc"><img src="img/2.jpeg"><cite>Подпись</cite></div></td>
<td ><div class="img-desc"><img src="img/3.jpeg"><cite>Подпись</cite></div></td>
<td rowspan="2"><a href="#"></a></td>
</tr>
<tr>
<td ><div class="img-desc"><img src="img/4.jpeg"><cite>Подпись</cite></div></td>
<td ><div class="img-desc"><img src="img/5.jpeg"><cite>Подпись</cite></div></td>
<td ><div class="img-desc"><img src="img/6.jpeg"><cite>Подпись</cite></div></td>
</tr>
</table>
</div>
</body>

</html>

  • 0

#6 sol

sol
    Topic Starter
  • Неактивные
  • 19 сообщений
  • Репутация: 0

Отправлено 09 Май 2009 - 18:40

ZiTosS, ОГРОМНОЕ СПАСИБО!

если знаешь помоги плз, нужен код вывода выпадающего списка типа select (надеюсь понятно объяснил, не знаю как иначе)
  • 0

#7 ZiTosS

ZiTosS
  • Неактивные
  • 5 148 сообщений
  • Репутация: 8

Отправлено 10 Май 2009 - 15:15

Не понял толком вопроса. Но вот обычный выпадающий список в HTML
<select name="mySelect">
<option value="1"> Первый вариант </option>
<option value="2"> Второй вариант </option>
<option value="3"> Третий вариант </option>
<option value="..."> ... </option>
<option value="N"> N-ный вариант </option>
</select>

  • 0



Похожие темы

  Название темы Автор Статистика Последнее сообщение

Оформление форума – IPBSkins.ru