 Автор |
Сообщение |
AlexRock
Гуру
 |
|
Что-то запарился - не получается и всё тут.
Сделал как тут сказали (и ещё подобное же решение в других местах предлагали): http://stopdesign.com/archive/2003/03/07/replace-text.html
Суть в том, чтобы поместить в div текст, скажем, в span, но сделать его невидимым через стиль, а задник у div (тоже через стиль установленный) тогда будет отображаться без перекрытия текстом span. Например (минимальный код):
| Код: |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>hello</title>
<style>
#title
{
width: 375; /* Реальный размер картинки */
height: 95; /* Реальный размер картинки */
background-image: url(logo.png);
background-repeat: no-repeat;
}
</style>
</head>
<body>
<div id="title">
<span style="display: none;">hello</span>
</div>
</body>
</html> |
Проблема в том, что ничего не видно в результате на странице. Стоит убрать
| Код: |
style="display: none;" |
и появляется картинка, перекрытая текстом span. Если же убрать весь текст и "display: none;" из span, то тоже ничего не видно, но на этот раз, как я понял, уже потому, что в div вроде как нечего отображать (span-то пустой). При этом задник div за содержимое, которое надо отображать, не считается. Пробовал в Опере и Ишаке - одинаково. Так вот, непонятно, почему у всех получается, а у меня - нет?
Есть такой выход - можно в span напихать неразрывных пробелов, и тогда часть картинки будет видна. Но если высота текста меньше высоты картинки, то будет видна только часть картинки - придётся подбирать высоту текста и количество неразрывных пробелов. Кроме того, это решение костыльное и не изящное.
На вопрос "а почему бы мне не сделать картинку через тег img?" отвечаю: через html-img браузер (в частности, Опера) распознаёт её как картинку (можно, например, через контекстное меню поглядеть свойства картинки), а через стиль - нет. Круто, правда?!  |
|
 |
|
 |
sham
ум, честь, совесть эпохи!
 Предупреждений : 4
|
|
| delПоследний раз редактировалось: sham (Ср 23-03-22 : 02-50), всего редактировалось 1 раз |
|
| |
|
|
AlexRock
Гуру
|
|
| sham писал(а): |
| <!doctype html> |
Что? Я такой шаблон на сайте каком-то нашёл по запросу "минимальный html". Всё равно, суть в тегах head и body.
| sham писал(а): |
| размеры заданы не в пикселях. |
Точно, спасибо - px указал и всё стало как надо. |
|
| |
|
|
sham
ум, честь, совесть эпохи!
Предупреждений : 4
|
|
| delПоследний раз редактировалось: sham (Ср 23-03-22 : 02-50), всего редактировалось 1 раз |
|
| |
|
|
Richard Ferlow
Гуру
 Предупреждений : 2
|
|
sham
это как сказать) пусть оставит тот что есть.
| Код: |
width: 375px;
height: 95px;
display:block; |
еще крайне не рекомендуют в стилях комменты на русском писать |
|
| |
|
|
|
Аватары: Вкл|Выкл ЮзерИнфо: Вкл|Выкл Подписи: Вкл|Выкл
|
Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете вкладывать файлы
Вы можете скачивать файлы
|
|
