Учебник по Html для начинающих. Таблицы.
Вложенные таблицы и некоторые нюансы.
Что такое вложенная таблица и в чем ее особенность? Это обычная таблица, которая располагается в ячейке другой таблицы.
Допустим, у нас уже есть большая таблица, две колонки которой забиты текстом какого-то отчета, а третья между ними для красоты:
| С каждым днем в интернете появляется все больше бяк и бук. Это особенные существа, роль которых в развитии современного общества не понятна, но тем не менее само их присутсвие заметно. Буки и бяки требуют особого обращения к себе, если обращаться к ним как к нормальным человеческим особям, то вы поняты не будете. | Вот таблица, которая показывает сколько бук, бяк и других обитает в интернете:
За сим все |
Итак, перед нами таблица из одного ряда, с тремя ячейками (столбцами), в третьей ячейке нельзя не заметить вложенную таблицу (с буками и бяками). Теперь код:
<table>
<tr>
<td width="200" valign="top" background="blue.gif" align="center">С каждым днем в интернете появляется все больше бяк и бук. Это особенные существа, роль которых в развитии современного общества не понятна, но тем не менее само их присутсвие заметно. Буки и бяки требуют особого обращения к себе, если обращаться к ним как к нормальным человеческим особям, то вы поняты не будете.</td>
<td width="10" background="white.gif"> </td>
<td width="200" valign="top" background="blue.gif" align="center">Вот таблица, которая показывает сколько бук, бяк и других обитает в интернете:
<br><br>
<table cellspacing="3">
<tr>
<td width="50" background="white.gif">
буки</td><td background="white.gif">65% населения</td>
</tr>
<tr>
<td width="50" background="white.gif">
бяки</td><td background="white.gif">20% населения</td>
</tr>
<tr>
<td width="50" background="white.gif">
др.</td><td background="white.gif">15% населения</td>
</tr>
</table>
<br><br>
За сим все</td>
</tr>
</table>
Вложенная таблица от обычной ничем не отличается. Благодаря вложенным таблицам гораздо проще управлять содержимым сайта.
Теперь поговорим, о некоторых нюансах, на которые следует обратить внимание: background="картинка.gif" - раньше мы говорили об атрибуте bgcolor, который задает цвет фона для таблицы (ряда, ячейки), а атрибут background задает фоновую картинку для таблицы (ряда, ячейки).
А теперь сам нюанс: вроде было бы логичнее прописать просто белый фон для вложенной таблицы (bgcolor="#ffffff"), а не мучиться, создавая просто белую картинку и делая ее фоном (background="white.gif"), ведь так оно быстрее. Да, быстрее, но дело в том, что если IE (Internet Explorer) отображает атрибут bgcolor для вложенных таблиц, то некоторые другие броузеры отказываются этот атрибут для вложенных таблиц отображать, поэтому приходиться идти обходным путем, используя background.
Давайте обратимся к коду нашей таблицы и вспомним, что эту ячейку мы ввели для красоты:
<td width="10" background="white.gif"> </td>
Чтобы ячейка не пустовала, в нее введен (символ неразрывного пробела, это спецсимвол, с ними мы ознакомимся подробно чуть позже). Это не просто так. Дело в том, что есть любители использовать конструкцию типа: <td></td>. Вот такую конструкцию некоторые браузеры просто-напросто игнорируют, т.к. не любят пустых ячеек, поэтому для корректного отображения вашей таблицы везде вставляйте в пустые ячейки или , или мелкую картинку размеров 1х1 пиксела.
<<< Страница 24 :Назад | Далее: Страница 26 >>>
