Приклад простої таблиці
Для більшої наочності розглянемо властивості таблиць детальніше. Тег <table> задає початок і кінець таблиці, будь-яка таблиця, як відомо, складається з рядків і стовпців, для цього є ще два теги: <tr> - рядок таблиці <td> - стовпчик таблиці. Приклад простої таблиці з трьома стрічками та стовпчиками:
<html>
<head>
<title>Таблиця</title>
</head>
<body>
<table border="1">
<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>
<tr>
<td> стрічка3 комірка1</td>
<td> стрічка3 комірка2</td>
<td> стрічка3 комірка3</td>
</tr>
</table>
</body>
</html>
Обрамлення таблиці за допомогою параметра BORDER не завжди однаково працює в різних браузерах. В цьому випадку можна використовувати вкладені таблиці. В першій таблиці потрібно задати ширину за допомогою параметра WIDTH тегу TABLE. Ця таблиця повинна складатися з одного ряду, в якому одна клітинка. У цю комірку потрібно вставити ще одну таблицю, задавши значення параметра WIDTH цієї таблиці рівним 100%. У результаті ширина внутрішньої таблиці буде прагнути до ширини комірки першої таблиці, в якій вона знаходиться. Далі потрібно задати параметр CELLPADDING першої таблиці рівним ширині бордюру в пікселах, який ви хочете побачити навколо вашої уявної таблиці. У нашому прикладі CELLPADDING = 1 для першої таблиці. Залишається задати параметр BGCOLOR для першої таблиці (це буде колір бордюру) і BGCOLOR для другої таблиці (це буде колір фону нашої уявної таблиці). Параметр BORDER обох таблиць повинен бути рівним 0, щоб уникнути відображення справжніх бордюрів таблиць.
Далі наводиться HTML код прикладу:
<TABLE BGCOLOR=black BORDER=0 CELLSPACING=0 CELLPADDING=1 WIDTH=50% ALIGN=center>
<TR>
<TD>
<TABLE BORDER=0 CELLSPACING=0 BGCOLOR=yellow WIDTH=100%>
<TR>
<TD ALIGN=center>Таблица</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
Дата добавления: 2015-05-08; просмотров: 784;