Лекция: Таблицы, вложенные друг в друга
Используя таблицы, можно выровнять информационные блоки на экране и разместить их в соответствии с дизайн-проектом документа. Метод вложенных таблиц позволяет создавать более интересные интерфейсы WEB-страниц.
Пример кода создания вложенных таблиц:
<html><body>
<table border=0 cellpadding=0 cellspacing=0 width=100%>
<tr>
<td><img src=«dino.gif» width=110 height=111 align=center></td>
<td width=«99%» bgcolor="#006600" align=center>
<font size=«6»face=«comic sans ms» color="#66ff66"><strong>
Вас приветствует «Красный уголок»</strong></font></td>
</tr><tr>
<td bgcolor="#006600" align=center>
<font face=«comic sans ms» size=7 color="#66ff66" style=«comic sans ms»>
выбери<br>тему:
<td>
<table border=0 bordercolor="#ffffff" cellpadding=0 cellspacing=1>
<tr>
<td align=center><img src=«704.jpg» width=180 height=160></td>
<td width=100% align=«center»>
<font face=«comic sans ms» size=6 color="#006600">звери</font></td>
</tr><tr>
<td align=center><img src=«469017.jpg» width=180 height=160></td>
<td width=100% align=«center»><font face=«comic sans ms» size=6 color="#006600">птицы</font></td>
</tr> <tr>
<td align=center><img src=«i427047.jpg» width=180 height=160></td>
<td width=100% align=«center»><font face=«comic sans ms» size=6 color="#006600">рыбы</font></td>
</tr>
</table>
</td>
</tr>
</table></html>
Результат исполнения кода представлен на рисунке 8.2.
Рисунок 8.2 – Пример использования вложенных таблиц для оформления HTML-страниц
Вопросы для самоконтроля
1. Назовите тег, обозначающий начало и конец HTML-документа.
2. Назовите тег, с помощью которого описывается заголовок HTML-документа.
3. Назовите тег, с помощью которого описывается тело документа.
4. Назовите теги, с помощью которых описываются заголовки разного уровня для оформления текстов.
5. Назовите тег, с помощью которого задается абзац HTML-документа.
6. Назовите тег, с помощью которого задается принудительный разрыв строки.
7. Назовите тег, с помощью которого задается цвет шрифта.
8. Назовите тег для увеличения шрифта по отношению к текущему размеру шрифта.
9. Назовите тег для уменьшения шрифта по отношению к текущему размеру шрифта.
10. Назовите тег, для задания жирного шрифта.
11. Назовите тег, для задания курсива.
12. Назовите тег, позволяющий сделать текст подчеркнутым.
13. Назовите тег для расположения элементов по центру HTML-страницы.
14. Опишите структуру задания маркированного списка.
15. Опишите структуру задания нумерованного списка.
16. Опишите структуру задания вложенных списков.
17. При помощи какого тега в HTML-документе прописывается ссылка?
18. Назовите тег, позволяющий браузеру отображать на экране графические изображения, перечислите атрибуты этого тега.
19. Атрибуты тега <BODY>, позволяющие задать цвет фона и фоновое изображение HTML-страницы.
20. Теги для программирования таблиц в HTML-документах, перечислите их основные атрибуты.