Таблицы в HTML | uCoz
   

Таблицы в HTML

Главная » Уроки » HTML

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

Таблицы в HTML

Начало и конец таблицы обозначаются тегами <TABLE> и </TABLE> соответственно. Строки – тегами <TR ></TR > , а ячейки – <TD></TD>.

Содержание вписывается между тегами <TD> и </TD>. Простейшая таблица формируется следующим набором тегов:

<TABLE>
<TR>
<TD> контент </TD> <TD> контент </TD> <TD> контент </TD>
</TR>
<TR>
<TD> текст </TD> <TD> текст </TD> <TD> текст </TD>
</TR>
</TABLE>

В этой таблице 2 строки и 3 столбца.

В теге <TABLE> задают параметры таблицы: ширину WIDTH, высоту HEIGHT, расположение по ширине страницы ALIGN, рамку BORDER, рамки между ячейками CELLSPACING, отступ между рамкой и содержимым ячейки CELLPADDING, цвет рамки BORDERCOLOR.

Например, запишем <TABLE WIDTH="60%" HEIGHT="100" ALIGN="center" BORDER="1" CELLSPACING=”0” CELLPADDING=”2”>. Получим таблицу шириной 60% от ширины экрана (фиксированную ширину задают в пикселях). Ее высота составит 100 пикселей. Расположится она посредине страницы (left – слева страницы, right – справа). Рамки ячеек совместятся (CELLPADDING="1" даст двойную рамку с расстоянием между линиями равным 1 пикселю, а при BORDER="0" рамка таблицы станет невидимой). Отступ между содержимым и рамкой ячейки будет равным 2 пикселям.

В тегах <TD> задают высоту (HEIGHT) и ширину (WIDTH) ячеек. При этом высота всех ячеек ряда должна быть одинакова, а ширина одинакова у ячеек столбца.

Тегом <TD> можно объединить несколько ячеек ряда, записав <TD COLSPAN="3">. Эта и следующие за ней 2 ячейки объединятся в одну. Этот же тег позволяет объединить ячейки столбца. Конструкция <TD ROWSPAN="2"> объединит ячейку этого ряда с расположенной ниже ячейкой следующего ряда. Поэтому в следующем ряду теги «<TD> содержание </TD>» этой ячейки не прописывают. По этому принципу можно объединить и большее количество ячеек столбца.

На каждую из ячеек таблицы распространяется действие каскадных таблиц стилей текущей страницы. При этом следует учитывать различие в отображении одного и того же html кода различными браузерами.

Пользуясь изложенными правилами нетрудно скомпоновать страницу сайта, отвечающую самым замысловатым требованиям.

Хотите сделать свой магазин более привлекательным для клиентов? Тогда купите дешевые платежные терминалы в компании «Автоматические Платежные Системы», и поставьте их на видном месте. После этого покупатели смогут оплачивать сотовых операторов, интернет, коммунальные услуги и так далее.

Категория: HTML; Урок сделан: 03.06.2012; Просмотров : 1340; Рейтинг : 0.0/0;
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Задать вопрос

Вы можете задать свой вопрос, соответствующий тематике сайта.

Задумался?

Задать свой вопрос

Вход


Здравствуйте, Гость!


Copyright © 2010-2016 Pro100uCoz.ru