Главная » Файлы » Лабораторные работы » Лабораторные работы |
Створення таблиць засобами HTML
[ Скачать с сервера (62.0 Kb) ] | 25.05.2017, 06:58 |
Завдання. 1. Створити таблицю №1 3x3, внести текст в комірки таблиці 2. Виконати обрамлення таблиці №1 3. Скопіювати таблицю №1 і назвати таблиця №2 і додати заголовок таблиці і обрамлення 4. Скопіювати таблицю №1 і назвати таблиця №3, застосувати групування стовпців таблиці (структурні та не структурні групи стовпців) і застосувати форматуванні в цій групі стовпців тексту 5. Скопіювати таблицю №1 і назвати таблиця №4, застосувати групування рядків таблиці і застосувати форматуванні в цій групі рядків тексту 6. Скопіювати таблицю №1 і назвати таблиця №5, змінити кольори елементів таблиці та фон таблиці, а також кольори рамки 7. Скопіювати таблицю №1 і назвати таблиця №6, і встановити ознаки горизонтального та вертикального вирівнювання 8. Скопіювати таблицю №1 і назвати таблиця №7, змінити розміри таблиці та змінити розміри комірок таблиці 9. Скопіювати таблицю №1 і назвати таблиця №8, застосувати механізм злиття комірок таблиці 10. Скопіювати таблицю №1 і назвати таблиця №9, застосувати вирівнювання даних таблиці (CELLSPACING, CELLPADDING) 11. Скопіювати таблицю №1 і назвати таблиця №10, застосувати відображення меж і ліній розділу таблиці (BORDER, FRAME, RULES) 12. Скопіювати таблицю №1 і назвати таблиця №11, застосувати керування переносом слів в середині комірок таблиці (NOWRAP) 13. Скопіювати таблицю №1 і назвати таблицю №12, задати параметри обтікання текстом, а також відміну обтікання для певного тексту (BR CLEAR=”?”) 14. Побудувати таблицю 3х4 і в кожній комірці розмісти вкладену таблицю, використовуючи 12 створених таблиць <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML> <HEAD> <TITLE>Веб-сторінка</TITLE> </HEAD> <BODY background=fon.jpg> <TABLE border=3 bordercolor=#0000FF> <CAPTION> Таблиця №1 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE border=4 bordercolor=#0000FF> <CAPTION> Таблиця №2 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE border=3 bordercolor=#0000FF> <CAPTION> Таблиця №3 </CAPTION> <colgroup span=1 align=center width=120> <colgroup span=2 align=right style=color:#0000FF> <TR> <TH>Назва</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD>АКС</TD> <TD>11</TD> <TD>12</TD> </TR> <TR> <TD>ГРТБ</TD> <TD>21</TD> <TD>22</TD> </TR> </TABLE> <br> <TABLE border=3 bordercolor=#0000FF CELLSPACING="2" CELLPADDING="10" > <CAPTION> Таблиця №4 </CAPTION> <THEAD style="background: #fc0"> <TR> <TH>Назва</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> </THEAD> <TFOoT style="background: #ffc" align=center> <TR> <TD>Сума</TD> <TD>21</TD> <TD>22</TD> </TR> </TFOOT> <TBODY style="background: #ccc"> <TR> <TD>АКС</TD> <TD>11</TD> <TD>12</TD> </TR> <TR> <TD>ГРТБ</TD> <TD>21</TD> <TD>22</TD> </TR> </TBODY> </TABLE> <br> <TABLE border=10 bordercolor=#000888 bgcolor=#808080> <CAPTION> Таблиця №5 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD BGCOLOR =”#00FF00”>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD>2 рядок 1 стовпчик</TD> <TD BGCOLOR =”#808000”>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE width=500 border=3 bordercolor=#0000FF> <CAPTION> Таблиця №6 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR align=left> <TD>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR align= right valign=top height=50> <TD>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE border=2 width=450 height=250 bordercolor=#0000FF> <CAPTION> Таблиця №7 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD width=70 height=70>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD width=70 height=30>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE border=2 bordercolor=#0000FF> <CAPTION> Таблиця №8 </CAPTION> <TR> <TH colspan=3>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD ROWSPAN=2>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE border=3 bordercolor=#0000FF CELLSPACING=7 CELLPADDING=4> <CAPTION> Таблиця №9 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE border=3 bordercolor=#0000FF frame=rhs rules=rows> <CAPTION> Таблиця №10 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE border=3 bordercolor=#0000FF width=300> <CAPTION> Таблиця №11 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD nowrap>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <br> <TABLE border=5 bordercolor=#0000FF width=300 align=left> <CAPTION> Таблиця №12 </CAPTION> <TR> <TH>1 стовпець</TH> <TH>2 стовпець</TH> <TH>3 стовпець</TH> </TR> <TR> <TD>1 рядок 1 стовпчик</TD> <TD>1 рядок 2 стовпчик</TD> <TD>1 рядок 3 стовпчик</TD> </TR> <TR> <TD>2 рядок 1 стовпчик</TD> <TD>2 рядок 2 стовпчик</TD> <TD>2 рядок 3 стовпчик</TD> </TR> </TABLE> <p>Атрибут ALIGN дозволяє вказати ознаку обтікання таблиць текстом. Значення left примушує браузер розмістити таблицю зліва від тексту, а right – справа від нього. Якщо необхідно, щоб форматуванню піддавався тільки певний фрагмент тексту, треба застосувати дескриптор з атрибутом CLEAR,</P> <BR CLEAR=all> який вказує позицію в тексті, починаючи з якої дія механізму обтікання таблиць текстом відміняється. Значення left, right, all атрибута CLEAR дозволяють визначити, з якого боку – лівого, правого чи з обох боків – текст далі буде вільний від таблиці. <br><br> <TABLE border=5> <TR> <TD> <TABLE border=3 bordercolor=#0000FF> <CAPTION> Таблиця №1 </CAPTION> <TR> <TH>1 стовпець</TH> | |
Просмотров: 460 | Загрузок: 13 | Рейтинг: 0.0/0 |
Всего комментариев: 0 | |