Маркетер
  • Маркетинг
  • Digital
  • Реклама
  • Public Relations
  • Менеджмент
  • Новости
  • Маркетинг
  • Digital
  • Реклама
  • Public Relations
  • Менеджмент
  • Новости
YouTube 154 Подписчики
Telegram 241 Подписчики
VK 0 Подписчиков
Маркетер
Маркетер
  • Маркетинг
  • Digital
  • Реклама
  • Public Relations
  • Менеджмент
  • Новости
  • HTML

Фоновые изображения в таблицах

  • 23.10.2001

Автор статьи: Головин Андрей

Еще одна головная боль web-мастера — использование фоновых изображений в таблицах. И Internet Explorer, и Netscape Navigator позволяют задавать фоновое изображение как всей таблице, так и отдельным ее элементам. Здесь отличия начинаются. IE никак не реагирует на атрибут BACKGROUND, установленный для элемента <TR>, в то время, как NN это позволяет. Да и сам принцип заполнения элементов фоном у этих браузеров отличается кардинально. IE заполняет все пространство таблицы, включая и рамки. NN, в отличие, от IE заполняет фоном каждую отдельную ячейку, даже если фон применяется к элементу <TR>. Кроме того NN «забывает» раскрасить границы. Все это наглядно можно увидеть в следующей таблице (в первой колонке указано к какому элементу применен атрибут BACKGROUND):

ie logo nn logo
background table background table
background td background td
background tr background tr

Правда замечательная картина? Будем с этим бороться. Бороться с этим неимоверно сложно. Если мы попробуем использовать вложенные таблицы, то результата, как ни бейся, не получим. Некий баг NN заставляет вложенную таблицу наследовать фон родительской таблицы. Следовательно, кроме того, что мы должны применять вложенную таблицу, необходимо установить фон из изображения с прозрачностью (вы, наверное, помните опыт по применению «однопиксельных» изображений с прозрачностью?). Приведенный далее код отображается абсолютно одинаково в обоих браузерах:

<TABLE CELLSPACING=0 CELLPADDING=0 BORDER=0 ALIGN=CENTER WIDTH=142>
<TR><TD BACKGROUND="images/0026_01.gif">
<TABLE CELLSPACING="2" CELLPADDING="2" BORDER="1"
       BACKGROUND="images/1pix_t.gif" WIDTH=142>
<TR>
    <TD>Ячейка 1</TD>
    <TD>Ячейка 2</TD>
</TR>
<TR>
    <TD>Ячейка 3</TD>
    <TD>Ячейка 4</TD>
</TR>
</TABLE>
</TD></TR>
</TABLE>

А вот и результат. Можете проверить сами.

Яч. 1 Яч. 2
Яч. 3 Яч. 4
alexvolkov

Предыдущий материал
  • Все о Photoshop

Фоновые изображения. Метлахская плитка

  • 23.10.2001
  • alexvolkov
Read More
Следующий материал
  • DHTML

внешние файлы в IE и NN

  • 23.10.2001
  • alexvolkov
Read More
Вас также может заинтересовать
Read More
  • HTML

Оптимизация. Важность тега TITLE

  • Алексей Волков
  • 30.11.2009
Read More
  • HTML

Советы начинающему верстальщику HTML

  • Алексей Волков
  • 25.11.2009
Read More
  • HTML

HTML — Долой тег hr из html разметки

  • Алексей Волков
  • 14.11.2009
Read More
  • HTML

«Резиновая» рамка с фигурными углами

  • alexvolkov
  • 27.07.2005
Read More
  • HTML

Создай свою Web-страницу за пять минут!

  • Алексей Волков
  • 31.03.2005
Read More
  • HTML

Блокнотик с подсветкой

  • Алексей Волков
  • 31.03.2005
Read More
  • HTML

HTML-редактор? Вот и редактируй!

  • Алексей Волков
  • 21.08.2003
Read More
  • HTML

Выбираем HTML-редактор

  • Алексей Волков
  • 14.08.2003

Добавить комментарий

Для отправки комментария вам необходимо авторизоваться.

Свежие посты
  • Дайджест постов Сергея Людкевича
    • 12.09.24
  • Как юристы тормозят бизнес
    • 30.08.24
  • Продвижение оптовых кампаний в Яндекс Директ
    • 06.03.24
  • Cарафанное радио
    • 13.01.24
  • 5-55: История компании
    • 01.03.23
Маркетер
  • О проекте
  • Информационное спонсорство
  • Рекламным агентствам
  • Ссылки
(с) ООО "Маркетер". Официальный сайт. Маркетер: Статьи про рекламу, маркетинг, public relations, интернет

Введите ключевые слова для поиска и нажмите Enter