
Наиболее распространённым средством в HTML являются таблицы. Но в HTML таблицы применимы не только для табличного представления информации, но и для форматирования сайтов.
На первых порах HTML как язык не имел необходимого функционала для создания таблиц. Это связано с тем, что язык был заточен под написания текстов. После того, как табличное представление информации стало необходимо для более доступного и понятного контента, HTML начал форматировать текст в столбцы. Но загвоздка заключалось в том, что выравнивание в столбах осуществлялось за счет ручного проставления пробелов. Это требовало много времени, которого порой не было.
Сейчас же создание таблиц в HTML производится с помощью специальных средств. Но способ с переформатированным текстом и ручным проставлением пробелов все еще в доступе и до сих пор используется.
Также HTML таблицы используются не только для распределения данных на колонки, но и для размещения данных на сайте. К примеру, HTML таблицы очень популярны для размещения всплывающей рекламы, картинок и другого подобного контента.
Как создать простую таблицу в HTML
Для того чтобы создать таблицу в HTML, необходимо знать основные теги, которые используются в создании таблицы HTML и их функционал:
- Описание таблицы должно быть заключено в раздел <BODY>. В одном документе может находиться любое количество таблиц. Также таблицы можно вкладывать друг в друга.
- Вне зависимости от назначения таблицы, она должна начинаться с тега <TABLE>, а заканчиваться </TABLE>. Между тегами заключается описание и детали таблицы.
- При создании таблицы необходимо каждую строку начинать с тега <TR> и заканчивать </TR>.
- Чтобы отделить ячейку, ее необходимо заключить в теги <TD> и </TD> (<TH> и </TH>). Теги <TH> в основном применяются для ячейки заголовка таблицы, а тег <TD> для тех ячеек, в которых в дальнейшем будут данные или текст. Различие этих тегов заключается в отображении текста, заключенного в них, и тем, что данные располагаются по-разному в самой ячейке. Текст в теге <TH> отображается как полужирный, а размещается ровно по центру ячейки. Текст в теге <TD> располагается у левого края ячейки и ровно посередине, если смотреть в вертикальном направлении.
- Строки в таблице регулируются количеством используемого тега <TR>, а количество столбиков определяется тегами <TD> или <TH>. К тому же, если в таблице предусмотрены ячейки без содержания данных, то их нужно заключить в теги <TD>, </TD>.
- Заголовок таблицы вписывают между тегами <CAPTION> и </CAPTION>.
Вышеперечисленные теги также могут иметь индивидуальные параметры, которые можно менять в зависимости от необходимости. Но в основном их используют без смены параметров, так как для большинства случаев подходят и стандартные значения.
Этот минимальный набор тегов достаточен для того, чтобы построить простую таблицу HTML.