Понедельник, 20.05.2024, 15:12
Главная
Регистрация
Вход
Мой сайт
Приветствую Вас Гость | RSS
Меню сайта
Категории раздела
Мои статьи [100]
Мини-чат
200
Наш опрос
От куда вы к нам пришли?
Всего ответов: 19
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0
Главная » Статьи » Мои статьи

Таблицы в 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 кода различными браузерами.

Пользуясь изложенными правилами нетрудно скомпоновать страницу сайта, отвечающую самым замысловатым требованиям.
Категория: Мои статьи | Добавил: BLeid9102 (15.04.2013)
Просмотров: 349 | Теги: Таблицы в HTML | Рейтинг: 0.0/0
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Вход на сайт

Поиск
Друзья сайта
  • Официальный блог
  • Сообщество uCoz
  • FAQ по системе
  • База знаний uCoz

  • | 2024 | |