Управление расстоянием между колонками и шириной полей текста на Web-странице
При создании документов с помощью таких программ, как Microsoft Word,текстовый процессор позволяет управлять внешними полями по краям каждойстраницы и расстоянием между колонками текста. К сожалению, язык HTML непредоставляет таких же возможностей при размещении текста на Web-странице.Однако помещение текстового содержимого в таблицу может в некотором роде сымитировать механизм управления внешними полями и расстоянием между колонками, который имеется в текстовом процессоре.
Пусть, например, вы хотите создать Web-страницу, которая, будучи отображена Web-браузером, напоминала бы созданный в текстовом процессоре документ с двумя колонками текста и соответствующим расстоянием между колонками (см.рис. 2.31).
ПРАКТИКУМ
В таблице, показанной на рис. 2.31, первый и последний столбцы таблицы определяют размер пространства, отведенного под левое и правое поле. В то жевремя третий столбец определяет размер интервала, который браузер оставит между колонками текста. И, наконец, второй и четвертый столбцы содержат в себе текст документа.
<table border="0" cellpadding="0" cellspacing="2" width="600">
<!-- Столбец, управляющий левым полем -->
<tr height="250">
<td width="20"><img src="trans.gif" width="20"></td>
<td width="200" valign="top">
<center><font size="5"><b> Сюда вставляется заголовок</b></font></center>
<p> Сюда вставляется текст основной части документа</p></td>
<!-- Столбец, управляющий расстоянием между колонками -->
<td width="15"><img src="trans.gif" width="15"></td>
<td width="200" valign="top">
<center><font size="5"><b> Сюда вставляется заголовок</b></font></center>
<p> Сюда вставляется текст основной части документа</p></td>
<!-- Столбец, управляющий правым полем -->
<td width="20"><img src="trans.gif" width="20"></td></tr>
</table>
Помещение текста в таблицу позволяет организовать текст и управлять его отображением в окне браузера, а хорошо организованный текст легче читается и воспринимается. Кроме того, не все браузеры корректно отображают пустые ячейки таблиц. Следовательно, чтобы таблица всегда отображалась так, как вы задумали, вставьте прозрачные GIF-изображения в ячейки полей и промежутка между колонками и установите атрибут width в дескрипторе <img> равным требуемой ширине поля или промежутка между колонками.
Рис. 2.31. Отображение двухколоночного текстового документа с использованием таблицы