High Star

Таблицы




Да! Настал этот день! Сегодня мы будем запихивать себя и других в рамки! А то ведь никакого порядка! Все должны сидеть в клетках, тьфу... держать себя в рамках. И будет тогда тишь и гладь, да божья благодать.

Сейчас я выдам вам тайну построения таблиц. Очень просто! И легко! Как все гениальное! Нужно только указать начало и конец таблицы. Опять же без тегов никуда. <TABLE> - начало таблицы, а </TABLE> - ее конец. Дальше - анархия. Итак, начнем:

Листинг 35. Наша первая таблица

<HTML>
  <HEAD>
    <TITLE>Наша первая таблица</TITLE>
  </HEAD>
  <BODY>
    <TABLE>
      <h1>Это наша первая таблица</h1>
    </TABLE>
  </BODY>
</HTML>

И смотрим, что получилось:


Первый блин комом. Вот что получилось!

А все почему? А потому, уважаемые граждане, что мы не указали ячеек! Ну не может таблица существовать без ячеек! Впрочем, как и общество. Хотя, конечно же, отсталые и дикие племена, да и некоторые несознательные граждане понятия не имеют про ячейки, но нам с ним не по пути! Мы люди современные, а потому ячейки нам необходимы как воздух и вода. Которые тоже, наверняка состоят из ячеек!

Единственное отличие таблицы от общества - это то, что общество не может состоять из одной ячейки, а вот таблица - запросто! И вот этот весь урок мы будем ее мусолить, впихивать туда, что в голову взбредет, короче, будем ее "иметь" и так и сяк и извиняюсь за невольно вырвавшуюся грубость, мордой об косяк.

Итак, мы хотим сделать таблицу из одной ячейки. Но одного хотенья мало! Нужно добавить еще и пару тегиков. Каждую ячеечку мы любовно обернем тегом <TD> с одной стороны, и </TD>, а чтобы она еще не простыла и (не дай бог!) не свалилась в конце строки, подопрем ее тегами <TR> в начале строки и </TR> в конце строчки. И тогда код у нас будет такой:

Листинг 36. Добавим теги

<HTML>
  <HEAD>
    <TITLE>Наша первая таблица</TITLE>
  </HEAD>
  <BODY>
    <TABLE>
      <TR>
        <TD>

        <h1>Это наша первая таблица</h1>
        </TD>
      </TR>
    </TABLE>

  </BODY>
</HTML>

Но, когда мы посмотрим, что получилось в браузере, то очень удивимся, потому как результат останется тем же! Но тут уж я над вами не шутила и шутить не собиралась. Дело в том, что мы не указали нужны ли нам границы или нет. Мы вот возьмем и напишем браузеру письмо, что, мол нам очень даже нужны границы и не какие-то там тощие, в 1 пиксел, а шириной в пять пикселов, с размахом, так сказать! И сделаем это с помощью атрибута border вот так:

Листинг 36. Добавляем рамку

<HTML>
  <HEAD>
    <TITLE>Наша первая таблица</TITLE>
  </HEAD>
  <BODY>
    <TABLE border=5>
      <TR>
        <TD>

        <h1>Это наша первая таблица</h1>
        </TD>
      </TR>
    </TABLE>

  </BODY>
</HTML>

И теперь побежим скорее смотреть, что у нас там выкинул наш строптивый браузер. А выкинул он вот что:


И это не предел!