8.Вкладені таблиці

Приклад:

<table border="0" cellspasing="0" cellpadding="1" align="center">

<tr bgcolor="black">

<td>

<table bgcolor="white" border="0" cellpadding="10">

<tr>

<td align="center">

Приклад простої вложеної таблиці

</td>

</tr>

</table>

</td>

</tr>

</table>

У прикладі бордовим кольором виділена зовнішня таблиця, а синім – внутрішня.

Більш складний приклад:

<TABLE border=0 cellpadding=0 cellspacing=0 width=466 align='center'>

<TR bgcolor= #a2aab9 >

<TD>

<TABLE border=0 cellpadding=1 cellspacing=1 width=466>

<TR>

<TD bgcolor=#bec6d8 align='center'>

<B>Модель</B></TD>

<TD bgcolor=#bec6d8 align='center'>

<B>Ціна</B></TD>

<TD bgcolor=#bec6d8 align='center'>

<B>Строк доставки</B></TD></TR>

<TR>

<TD bgcolor=#e3e7ee align='center'>

P-200MMX/64/6,4/4-SVGA-LAGUNA/17"</TD>

<TD bgcolor=#e3e7ee align='center'>

$450</TD>

<TD bgcolor=#e3e7ee align='center'>

зі складу</TD></TR>

<TR>

<TD bgcolor=#e3e7ee align='center'>

HPSJ6200/USB-SCSI/35mm.slide-module</TD>

<TD bgcolor=#e3e7ee align='center'>$440</TD>

<TD bgcolor=#e3e7ee align='center'>

тиждень</TD></TR>

</TABLE>

</TD></TR>

</TABLE>

Колірне рішення таблиці: одна тональність, підбір кольору рамки підкреслює текст). Основним недоліком можуть бути різкі тони комірок таблиці. Рекомендується застосовувати в таблицях у якості фону один колір з невеликими тональними відмінностями

Послідовність виконання роботи:

1. Ознайомтесь з теоретичним матеріалом про локальні гіперпосилання та розташуйте їх на сторінці Сергєєва.

На сторінці Сергєєва є три розділи: вступний текст, казка й розповідь. Сторінка може мати такий вигляд:

<HTML>

<HEAD>

<TITLE>Домашня сторінка Сергія Ceгєєв</TITLE>

</HEAD>

<BODY TEXT="#000000" BGCOLOR="#babaa0" vlink='#006699' alink='red'>

<h1 align="center"><font face='arial'>Домашня сторінка Сергія Сергєєва</font></h1>

<P align="center">

<FONT SIZE=+0>

<a href="#skazka">Казка &#171Іван-царевич і сірий заєць&#187</A>

   

<A HREF="#rasskaz">Розповідь &#171Молоток&#187</a></FONT>

</p>

<p>

<FONT FACE="Times New Roman">

<B>Сергій Сергєєв - письменник-авангардист, автор 20 розповідей. <BR>

У житті великий аматор собак і комп'ютерних ігор. <BR><BR>

Деякі його розповіді ви можете прочитати прямо тут.</b>

</FONT>

</P>

<P><HR WIDTH="75%"></P>

<H2 ALIGN="CENTER"><FONT FACE="Times New Roman">

<A name='skazka'> ІBAH-ЦАРЕВИЧ І СІРИЙ ЗАЄЦЬ </A><BR>

казка</FONT></H2>

<P ALIGN="RIGHT"> «Hy, погоди…!!!!» <BR>( З мультфільму)</P>

<P ALIGN="JUSTIFY"><FONT FACE="Times New Roman">

Жив був Іван-Царевич, і все в нього було: і злато-срібло, і наречених повний

палац, і книжок багато розумних, і тренажерний зал величезний... <BR>

чи Довго, чи коротко ... <BR>

І вони жили довго й щасливо й померли в один день</FONT> </P>

<P><HR WIDTH="75%"></P>

<H2 ALIGN="CENTER"><FONT FACE="Times New Roman">

<A name='rasskaz'>MOЛOTOK</A><BR>

розповідь</font></H2>

<P ALIGN="RIGHT">Mи ковалі, і дух наш молодий<BR>

( З пісні)</P>

<P>Це трапилося дуже давно, уже й не пам'ятаю в якому році, у якім столітті й

у якім тисячоріччі... (Тут розташовується текст розповіді) </P>

</BODY>

</HTML>

Якщо ми тепер клацнемо на який-небудь із гіперпосилань, то сторінка “скакне” вниз, так, щоб текст нашого якоря відображався вгорі екрана. (Однак, якщо при цьому для заповнення на екрані не буде вистачати тексту, то текст якоря може виявитися не на самому верху сторінки, а трохи нижче.)

2. Виділіть в окремі файли вступний текст і кожну з розповідей. Тоді якщо користувачеві необхідно буде прочитати який-небудь один фрагмент (наприклад оповідання “Молоток”), йому не треба буде для цього чекати завантаження всього тексту, розташованого вище.

Основний файл назвемо index.html:

<HTML>

<HEAD>

<TITLE>Домашня сторінка Сергія Cepгєєвa</TITLE>

</HEAD>

<BODY BGCOLOR="#BABAAO" TEXT="#1D1D18" LINK="#634438" VLINK="#634438" ALINK="red">

<H1 ALIGN="center">

<font face='arial'>Дoмaшня сторінка Сергія Cepгєєва</font>

</H1>

<P ALIGN="center">

<A HREF="skazka.html">KА3KА &#171ІBАH- царевич і сірий зaяць&#187</A>

   

<A HREF="rasskaz.html">Розповідь &#171Moлоток&#187</A>

</p>

<FONT SIZE="+l"><B>Cepгій Сергєєв</B> - письменник-авангардист,

автор 20 розповідей<BR>

У житті великий аматор собак і комп'ютерних ігор<br><br>

Деякі його розповіді ви можете прочитати прямо тут.<BR></FONT>

<P><HR WIDTH="75%"></P>

</BODY>

</HTML>