Студопедия

Главная страница Случайная страница

КАТЕГОРИИ:

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






Порожню комірку описують, як <td></td>або<td>&nbsp;</td> .






Лабораторна робота № 3

Тема:«HTML. Створення web-сторінки з таблицями»

Мета: Уміти додавати на сторінку таблицю. Форматувати строки, стовпці та комірки таблиці.

ТЕОРЕТИЧНІ ВІДОМОСТІ

Створення таблиць

<table параметри> </table>

 

Тег <table> служить контейнером для елементів, що визначають вміст таблиці. Будь-яка таблиця складається з рядків і комірок, які задаються за допомогою тегів <tr> і <td>.

Деякі параметри <table>

bordercolor = “колір рамки

bgcolor= “колір таблиці

border= “товщина рамки

cellpadding=Відступ від рамки до вмісту комірки
cellspacing= “Відстань між комірками

Тег <thead> призначений для зберігання одного або кількох рядків, які представлені вгорі таблиці. Допустимо використовувати не більше одного елемента <thead> в межах однієї таблиці, і він повинен йти у вихідному коді відразу після тегу <table>

 

Тег <tr> служить контейнером для створення рядка таблиці. Кожна комірка в межах такого рядка може задаватися за допомогою тегу <th> або <td>.

 

Тег <th> призначений для створення однієї комірки таблиці, яка позначається як заголовна. Текст в такій клітинці відображається браузером зазвичай жирним шрифтом і вирівнюється по центру.

 

Тег <td> призначений для створення однієї комірки таблиці.

 

Деякі параметри <th> та <td>

align= “left|right|center|justify” - визначає вирівнювання вмісту комірки по горизонталі.

valign= “top|bottom|middle” - визначає вирівнювання вмісту комірки по вертикалі.

bgcolor= “Колір фону комірки

bordercolor= “Колір рамки

colspan= “Об'єднує горизонтальні комірки

rowspan= “Об'єднує вертикальні комірки

height= “Висота комірки

width= “Ширина осередку

 

Приклад

<table>

<thead>Заголовок таблиці </thead>

<tr>

<th>текст заголовок у комірці</th>

<td>текст у комірці</td>

</tr>

<tr>

<th>текст заголовок у комірці</th>

<td>текст у комірці</td>

</tr>

………………….

</table>

Порожню комірку описують, як <td></td>або<td>&nbsp;</td> .

ПОСЛІДОВНІСТЬ ВИКОНАННЯ РОБОТИ

 

1.На новій web-сторінці створить таблицю з даними про свій рейтинг.

Таблиця буде складатися з 3 стовпців та 4 рядків.

Задайте заголовок таблиці “Результати рейтингу”.

Задайте заголовки стовпців та рядків.

Заповніть таблицю оцінками.



2.Новий файл збережіть під назвою file3.htm. Перегляньте його у браузері.

3.Змінить вигляд таблиці. Задайте товщину рамки таблиці, на приклад, 3, задайте кольори рамки та фона таблиці.

4.Вирівнюйте текст у клітинках таблиці.

У заголовках – по центру, в інших комірках – на ваш смак.

5.Задайте ширину та висоту комірок.

 

 

Рис 3. Приклад виконання роботи

 


КОНТРОЛЬНІ ЗАПИТАННЯ

1. Яке призначення тегу table?

2. Який параметр тегу table використовується для завдання товщини рамки таблиці?

3. Який параметр тегу table використовується для завдання відступу від рамки до вмісту комірки та для завдання відстані між комірками?

4. Які теги формують у таблиці рядки, клітинки-заголовки і звичайні клітинки?

5. Як у таблиці об'єднати декілька клітинок в одну?

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



mylektsii.ru - Мои Лекции - 2015-2020 год. (0.009 сек.)Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав Пожаловаться на материал