Таблицы вошли очень прочно в веб дизайнерство и теперь без них сложно представить даже самую простую страничку. Удобство при их использовании сложно описать словами, да и не нужно.
Параметрами этого тега задается обший вид таблицы, ее цвет, толщина рамки и многое другое. И вот какие аргументы могут быть:
Далее уже начинается сама таблица. Для того чтобы создать новый ряд ячеек в таблице существует тег <tr>. Закрывающую скобку можно не указывать. Для создания новой ячейки предназначен тег <td> или <th>. Количество ячеек (т.е. элементов <td> и <th>) должно быть одинаково в каждом ряду таблицы, т.е. внутри каждого тега <tr>
Пример простейшей таблицы:
<table border=1> <tr><td>Первая ячейка<td>Вторая ячейка <tr><td>новый<td>ряд </table>В этом случае будет такая вот таблица :
Первая ячейка | Вторая ячейка |
новый | ряд |
Тег <tr> имеет несколько атрибутов.
Ячейки таблицы более богаты своими параметрами. Чтобы не писать снова, скажу что в них входят все параметры строк таблицы описанные выше, ну и еще парочка другая следующих :-) :
<td></td>То она не отображается браузером (по крайней мере у меня в IE 4.0), т.е. не появляется рамка ячейки. Для этого по идее надо пользоваться
<td nospan></td>Но и тут прикол, IE и ее не отображает. А вот Opera 3.51 отображает все эти дела в любом сочетании :-), я вот только еще в Netscape Navigator'е не проверил, потому что лень второй винт подключать с Линуксом. Ну короче не знаю, что об этом сказать, по видимому специально для IE вам придется пользоваться закодированным пробелом , потому что что-то типа <td>[пробел]</td> не сработает из-за того что все пробелы игнорируются браузерами.
Наверно многие не поняли как это могут ячейки объединяться. А вот как !!! Пример:
<table border=2> <tr><td>1<td>2<td>3<td>4<td>5 <tr><td colspan=2 rowspan=2>6<td colspan=2>7<td rowspan=2>8 <tr><td>9<td>10 <tr><td>11<td>12<td>13<td>14<td>15 </table>А вот как это все выглядит :
1 | 2 | 3 | 4 | 5 |
6 | 7 | 8 | ||
9 | 10 | |||
11 | 12 | 13 | 14 | 15 |
Как видите в первой строке 5 элементов <td>. Вот во второй строке уже те самые чудеса творятся !!! Элементов <td> теперь уже всего 3, НО заметьте что если просуммировать все значения colspan, то снова получится 5. Ксати по умолчанию для каждой ячейки параметр colspan равен 1.
Третья строчка еще веселее, потому что над ней можно час думать и голову сломать, но всеже тут все просто. Вы должны взять и посмотреть сколько ячеек у вас "выростает" вниз и посмотреть их ширину. А нашем примере у нас есть 2 ячейки параметр rowspan в которых не равен 1, причем первая расширяется на 2 ячейки. Итого значит в этой строчке остаются незаполненными всего 5-3=2 ячейки. Что и соответствует дейстительности :-).
Вобщем понять это не просто, но Вы научитесь. Кстати очень замечательная особенность Html, в том что в ячейке можно сделать вложенную таблицу, а в ней еще одну и т.д. пока таблицы не кончатся :-).
Еще хотелось сказать немного о элементе <th>. Он, как уже говорилось ранее, также задает ячейку, но только отличается тем что текст внутри такой ячейки отображается жирным шрифтом. И ИМХО этот элемент просто эквивалентен <td><b>...</b>, только короче и проще.
Ну вобщем про таблицы все. Только осталось добавить, что на самом деле разные браузеры имеют дополнительные параметры для красоты таблиц, но так как мы условились писать наши документы для всех браузеров и всех платформ ,я не написал о них, а потом они не входят в спецификацию языка.
Если они вас очень интересуют, то изучайте коды своих браузеров :-). Ну или на худой конец запустите FrontPage и узнайте, что же все-таки дорогой Билли заложил в свой IE !!! Только смотрите не найдите тайные ходы в нем, а то он обидится :-))) !!!