Самообучение HTML училище

Кратко ръководство по HTML за начинаещи


Автор: Joe Barta » Превод: Ан.Начев » Последна редакция: LeoS

Единадесети урок » (4143 посещения)

А можем ли да поставим таблица в таблица?
Нека опитаме. Много ясно, че няма да минем без Ed...

<TABLE BORDER=3>
<TR>
<TD>Ed</TD>
</TR>
</TABLE>
Ed

Уголемяваме таблицата колкото ни е нужно.

<TABLE BORDER=3 WIDTH=200 HEIGHT=100>
<TR>
<TD>Ed</TD>
</TR>
</TABLE>
Ed

Заместваме Ed с втора таблица.

<TABLE BORDER=3 WIDTH=200 HEIGHT=100>
<TR>
<TD>

<TABLE BORDER=3>
<TR>
<TD>Ed</TD>
</TR>
</TABLE>

</TD>
</TR>
</TABLE>
Ed

Това е !
Нашата таблица може да бъде и центрирана.

<CENTER>
<TABLE BORDER=3 WIDTH=200 HEIGHT=100>
<TR>
<TD>
<TABLE BORDER=3>
<TR>
<TD>Ed</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</CENTER>

Ed


_________________________
Ето една ситуация, където с таблица ще може да се разреши често срещан проблем.
Да кажем, че имате добрата идея да поставите анимиран gif файл на страницата си. Обаче за съжаление картинката е прекалено голяма. Тъй като анимираните gif файлове представляват серия от картинки, които се сменят една след друга (като в киното), като изграждат един комплексен файл, който изисква повече време за зареждане. Сами разбирате, че вашите посетители няма да са никак щастливи, ако е нужно да свалят картинка от 700 kB. Какъв е изходът ли? Нарежете картинката и я поставете в таблица.
След това анимирате само малка част от картинката като печелите от това, че няма наслагване на кадри върху неанимираните части. По този начин и вълкът е сит и агнето е цяло.
Ще ви стане по-ясно, след като разгледате следващия пример:

Netscape срещу Microsoft?

Ето тук същата таблица, но с включване на BORDER вече се дава възможност за визуализиране границите на картинките.

Netscape срещу Microsoft?

Единствената част от картинката, която е анимирана са очите.
Ето ви и html кода за тази таблица.

<TABLE WIDTH=591 BORDER=0 CELLSPACING=0 CELLPADDING=0>
<CAPTION ALIGN=top><FONT SIZE=6><STRONG><EM>Netscape срещу Microsoft ?</EM></STRONG></FONT></CAPTION>
<TR>
<TD ROWSPAN=3><IMG SRC="dragon4.gif" WIDTH=250 HEIGHT=406></TD>
<TD><IMG SRC="dragon3.gif" WIDTH=122 HEIGHT=109></TD>
<TD ROWSPAN=3><IMG SRC="dragon5.gif" WIDTH=219 HEIGHT=406></TD>
</TR>
<TR>
<TD><IMG SRC="anidrag.gif" WIDTH=122 HEIGHT=50></TD>
</TR>
<TR>
<TD><IMG SRC="dragon2.gif" WIDTH=122 HEIGHT=247></TD>
</TR>
</TABLE>

А това е схемата за влагане на картинките в таблицата.

dragon4.gif dragon3.gif dragon5.gif
anidrag.gif
dragon2.gif

Вече сте многознайковци и мисля, че няма какво повече да научите в областта на правенето на страници. С две думи, изкарахте и втори клас, изучихте се и вече е време да се хващате на работа.