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

Реферальная программа Мегаплана


Описание изображения 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