Відступи

Для встановлення одного, двох i трьох відступів використовується тег <ul> </ul> за зразком:

<ul> один ввдступ </ul>

<ul> <ul> два ввдступи </ul></ul>

<ul> <ul><ul> три ввдступи </ul></ul></ul>

Питания для самоконтролю:

1. Як у Web-сторінку вставити малюнок?

2. Як встановити обтікання мапюнка текстом?

3. Як встановити відстань між текстом i малюнком?

4. Як встановити горизонтальні i вертикальні розмфи малюнка?

5. Як створити посилання на інший документ?

6. Як записати посилання на поштову скриньку?

7. Яке ім'я повинен мати головний документ?

8. Як створити список і вибрати маркер для нього?

9. Як зробити один, два або три відступи?

Комплексна лабораторна робота "створення html-файла"

Виконати такі дії:

1. На листку паперу або в зошиті написати текст HTML-файла для створення Web-сторінки за наведеним взірцем (без списку).

Привіт, це моя перша сторінка Прізвище, ім’я, група Шановний колего! Я вивчаю мову HTML, щоб створити власну домашню Web-сторінку для спілкування з друзями та знайомими. Щоб вони могли подивитися мою фотокартку, прочитати про мене, написати декілька рядків в мою книгу для гостей. Ось перші прізвища гостей в цій книзі: Іваненко Іван Петренко Петро Сидоренко Микола

Рисунок 3. Взірець HTML-сторінки

2. Відкрити редактор "Блокнот", набрати текст HTML-файла, зберегти його у еласну папку з менем Лабораторна робота i з РОЗШИРЕННЯМ .HTML.

3. Відкрити програму Internet Explorer, переглянути у власній nanці створений HTML-файл, виправити можливі помилки. Закрити Internet Explorer.

4. В текст файла Лабораторна робота.HTML додати список згідно взірця, зберегти його у еласну папку з тим самим іменем.

5. Програмою Internet Explorer переглянути відредагований HTML-файл, виправити молсливі помилки. Закрити програму Internet Explorer.

6. Зняти на сканері фотокартку або створити своє зображення графічним редактором, зберегти файл у власну папку.

7. Створити HTML-файл додаткового документа з довільним іменем, де розмістити файл свого зображення.

8. Ввести на додаткову сторінку електронну адресу свою або свого навчального закладу.

9. Відкрити програму Internet Explorer, переглянути створений HTML-файл додаткового документа, виправити можливі помилки. Закрити програму Internet Explorer.

10. В тексті HTML-файла головного документа створити посилання "подивитися мою фотокартку" на додатковий документ.

11. Завантажити броузер Internet Explorer i в ньому відкрити створений головний документ.

12. Здійснити перехід у додатковий документ за допомогою посилання. Повернутися на головну сторінку. Закрити програму Internet Explorer. Закрити eci програми i папки.

Оформления таблиць

Для раціонального розподілу площі сторінки між її текстовими i графічними фрагментами використовують таблиці.

Таблиця задається тегом <table> </table>.

Рядки таблиці задаються тегом <tr> </tr>.

Стовпчики таблиці задаються тегом <td> </td>.

Нехай потрібно створити таблицю з двома рядками i трьома стовпчиками наведеного виду i наповнення (Рисунок 4).

1	2	3
1х1	1х2	1х3	1
2х1	2х2	2х3	2

Рисунок 4. Таблиця

Для створення цієї таблиці необхідно набрати такий текст (спечатку задаються рядки):

<table

<tr>

<td>lxl</tr>

<td>lx2</tr>

<td>lx3</tr>

</tr>

<tr>

<td>2xl</tr>

<td>2x2</tr>

<td>2x3</tr>

</tr>

<table>

Щоб у вздповвдних комірках таблиці задати колір фону (параметр bgcolor), висоту (height) i ширину (width) комірок таблиці в пікселях, треба вище наведений текст доповнити таким чином:

<table

<tr>

<td height ="35" width="50" bgcolor="#FFCC33">lxl</tr>

<td width="50" bgcolor="#336699">1x2</tr>

<td width="50" bgcolor="#FFCC33">lx3</tr>

</tr>

<tr>

<td height ="35" width="50" bgcolor="#336699">2xl</tr:>

<td width="50" bgcolor="#FFCC33">2x2</tr> <td width="50" bgcolor="#336699">2x3</tr>

</tr>

<table>