BigApple.ru » Интернет » HTML » Базовый макет вывода в несколько столбцов

Базовый макет вывода в несколько столбцов

Добавлено: 13.02.2012
Автор: rrrr

Базовый макет в две колонки с применением тега <table> включает в себя одну строку с тремя ячейками данных – по одной на каждый столбец – и одной пустой ячейкой в промежутке, чтобы красивее отделить столбцы друг от друга. Мы вставили также атрибут cellspacing с большим значением, чтобы увеличить расстояние между столбцами.

Следующий HTML-пример таблицы дает превосходный шаблон для простого макета в две колонки.

<table border=0 cellspacing=7> <tr>

<td>Copy for column 1...

<td><br>

<td>Copy for column 2... </table>

На рис. 17.1 можно видеть результат.

Рис. 17.1. Простой макет в две колонки

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

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

0 комментариев
Оцените статью:
Участник обсуждения

Нажмите, чтобы ответить

     
Время формирования страницы на сервере: 0.327 сек.