Теги Html скачать Таблицу

Теги Html скачать Таблицу.rar
Закачек 3648
Средняя скорость 1566 Kb/s
Скачать

Теги Html скачать Таблицу

07.06.2014 Дмитрий Демченко 12683 + Веб-Мастеру
HTML гипертекст таблица

Б ез знаний языка гипертекстовой разметки нельзя создать ни одного веб-сайта или какого-либо другого интернет проекта. Все начинается с HTML, а уже потом все остальное CSS, PHP и другие различные скриптовые языки для формирования всяких красивостей и интересных функций. Не смотря на свою простоту в использовании при создании html страниц, этот язык имеет около 130, а возможно и больше тегов, к которым применяются разные атрибуты для изменения различных свойств.

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

Но практически всегда вы увидите в коде страницы такие теги как тип документа , , , титл заголовка страницы ,

параграфы и вставка изображений , а так же многие другие.

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

С недавнего времени тег

Синтаксис тега

Между открывающим тегом

Как сделать таблицу в html

Приведем пример, html код:

Преобразуется на странице в следующее:

Обратите внимание на ячейку

Теперь рассмотрим подробно все атрибуты тега

Атрибуты и свойства тега

К открывающему тегу

1. Свойство align=»параметр» — задает выравнивание таблицы. Может принимать следующие значения:

  • left — выравнивание по левому краю
  • center — выравнивание по центру
  • right — выравнивание по правому краю

В разобранном выше примере мы выравнивали таблицу по центру align=»center» .

Этот атрибут можно применять не только к таблице, но и к отдельным ячейкам таблицы

2. Свойство background=»URL» — задает фоновой рисунок. Вместо URL должен быть написан адрес фонового изображения.

Преобразуется на странице в следующее:

В рассмотренном примере наше фоновое изображение находится в папке img (которая находится в той же директории, что и html-страница), а называется изображение fon.gif . Обратите внимание на то, что в теге мы добавили style=»color:white;» . Поскольку фон почти черный, то для того, чтобы текст не слился с фоном, мы сделали текст белым.

Более подробно про фон читайте в статье: как сделать фон для сайта

3. Свойство bgcolor=»цвет» — задает цвет фона таблицы. В качестве цвета можно выбрать любой из всей палитры (см. коды и названия html цветов)

4. Свойство border=»число» — задает толщину рамки таблицы. В предыдущих примерах мы указывали border=»1″ , что означает толщина рамки — 1 пиксель.

5. Свойство bordercolor=»цвет» — задает цвет рамки. Если border=»0″ , то рамки не будет и цвет рамки не будет иметь смысла.

6. Свойство cellpadding=»число» — отступ от рамки до содержимого ячейки в пикселях.

7. Свойство cellspacing=»число» — расстояние между ячейками в пикселях.

8. Свойство cols=»число» — число столбцов. Если его не задать, то браузер сам определит число столбцов. Разница лишь в том, что указание этого параметра, скорее всего, ускорит загрузку таблицы.

9. Свойство frame=»параметр» — как отображать границы вокруг таблицы. Может принимать следующие значения:

  • void — не отрисовывать границы
  • border — граница вокруг таблицы
  • above — граница по верхнему краю таблицы
  • below — граница снизу таблицы
  • hsides — добавить только горизонтальные границы (сверху и снизу таблицы)
  • vsides — рисовать только вертикальные границы (слева и справа от таблицы)
  • rhs — граница только на правой стороне таблицы
  • lhs — граница только на левой стороне таблицы

10. Свойство height=»число» — задает высоту таблицы: либо в пикселях, либо в процентах.

11. Свойство rules=»параметр» — где отображать границы между ячейками. Может принимать следующие значения:

  • all — линия рисуется вокруг каждой ячейки таблицы
  • groups — линия отображается между группами, которые образуются тегами

12. Свойство width=»число» — задает ширину таблицы: либо в пикселях, либо в процентах.

13. Свойство class=»имя_класса» — можно указать имя класса, которому принадлежит таблица.

14. Свойство style=»стили» — стили можно задать индивидуально для каждой таблицы.

Теперь настало время погрузиться внутрь таблицы и рассмотреть атрибуты ячеек таблицы. Эти атрибуты надо писать в открывающем теге

Атрибуты и свойства

1. Свойство align=»параметр» — задает выравнивание отдельной ячейки таблицы. Может принимать следующие значения:

  • left — выравнивание по левому краю
  • center — выравнивание по центру
  • right — выравнивание по правому краю

2. Свойство background=»URL» — задает фоновое изображение ячейки. Вместо URL должен быть написан адрес фонового изображения.

3. Свойство bgcolor=»цвет» — задает цвет фона ячейки.

4. Свойство bordercolor=»цвет» — задает цвет рамки ячейки.

5. Свойство char=»буква» — задает букву, от которой нужно сделать выравнивание. Значение атрибута align должно быть установлено как char.

6. Свойство colspan=»число» — задает число объединяемых горизонтальных ячеек.

7. Свойство height=»число» — задает высоту таблицы: либо в пикселях, либо в процентах %.

8. Свойство width=»число» — задает ширину таблицы: либо в пикселях, либо в процентах %.

9. Свойство rowspan=»число» — задает число объединяемых вертикальных ячеек.

10. Свойство valign=»параметр» — выравнивание содержимого ячейки по вертикали.

  • top — выравнивание содержимого ячейки по верхнему краю строки
  • middle — выравнивание по середине
  • bottom — выравнивание по нижнему краю
  • baseline — выравнивание по базовой линии

Примечание 1

Как сделать, чтобы границы ячеек в таблице не склеивались

В случае использования border (граница ячеек) и нулевых отступов между ячейками, они все равно склеиваются и получается удвоенный border. Чтобы это избежать нужно прописать в стилях таблице border-collapse: collapse :

Более подробно про это свойство читайте в специальной статье border-collapse CSS

Уважаемый читатель, теперь Вы узнали гораздо больше о html теге table. Теперь советую перейти к следующему уроку.

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

Всего насчитывается более ста элементов разметки. Каждый имеет ряд атрибутов и собственный синтаксис. Справочник по тегам HTML поможет быстрой найти нужный вам элемент.

Список тегов HTML

Ниже в таблице представлен список тегов HTML5 с кратким описанием на русском языке.


Статьи по теме