Практика разработки Web-страниц


2 - часть 2


  • Для каждого столбца (тэг <TD>) установите атрибут width по ожидаемой ширине его содержимого в пикселах. Если какие-нибудь ячейки должны охватывать больше одного столбца, например заголовок, идущий поперек всей страницы, установите значение атрибута colspan равным числу столбцов. Ниже приведена типовая таблица размещения с тремя столбцами, у которой объединены ячейки для заголовка страницы и для нижнего колонтитула, для каждого раздела использованы различные цвета фона, а сама таблица появляется в центре окна броузера. Таким образом, эту таблицу можно просматривать в любом окне, если оно хотя бы 600 пикселов в ширину:

    <table align=center border=0 cellpadding=10 cellspacing=0> <tr> <td colspan=3 align=center bgcolor="#99ccff"> <img src="banner.gif" alt="Banner goes here." width=590 height=60> </td> </tr> <tr valign=top> <td width=100 align=right bgcolor="#ffcc66"> <a href="pageone.htm">Hyperlink</a><br> <a href="pagetwo.htm">Another Link</a><br> </td> <td width=350> <h1>Heading</h1> <p>This is the main section of the page.</p> </td> <td width=100 align=center bgcolor="#ff9933"> <img src="ad1.htm" alt="Ad #1" width=96 height=96 vspace=6><br> <img src="ad2.htm" alt="Ad #2" width=96 height=96 vspace=6><br> </td> </tr> <tr> <td colspan=3 align=center bgcolor="#cccccc"> Copyright © 2000 Nobody </td> </tr> </table>

    Даже если вы определяете фиксированные размеры для всех столбцов в таблице, броузер все же может изменять их. Например, если ячейка содержит слишком широкое изображение, она расширяется, чтобы отобразить его полностью. Если вы определяете ширину всей таблицы, что несколько больше, чем просто сумма ячеек, или опускаете установку ширины для каждого столбца, броузер распределяет дополнительное пространство внутри ячеек.




    Начало  Назад  Вперед