HTML теги. HTML списки. Список директорий
Здравствуйте, уважаемые посетители моего скромного блога для начинающих вебразработчиков и web мастеров ZametkiNaPolyah.ru. Продолжаем рубрику Заметки по HTML и…
Таблица HTML. Тег COLGROUP. Оформление HTML таблицы
Здравствуйте, уважаемые посетители моего скромного блога для начинающих вебразработчиков и web мастеров ZametkiNaPolyah.ru. Продолжаем рубрику Заметки по HTML и ее раздел HTML теги. Данная публикация посвящена HTML тегу <colgroup>. Описание тега <colgroup>, атрибуты тега <colgroup>, синтаксис тега <colgroup>, пример использования тега <colgroup>. Тег <colgroup> относится к группе тегов HTML таблицы.
Не забываем подписываться на RSS-ленту, twitter и на публичную страницу Вконтакте.
Содержание статьи:
HTML тег <colgroup>. Описание <colgroup>
HTML тег <colgroup> относится к тегам предназначенным для формирования HTML таблиц. Тег <colgroup> предназначен для изменения характеристик одной или сразу нескольких колонок HTML таблиц. При помощи тега <colgroup> можно изменять ширину колонки, горизонтальное и вертикальное выравнивание, изменить сдвиг содержимого ячейки таблицы.
Как и в случае с тегом <col>, наличие тега <colgroup> говорит браузеру о том, чтобы он начинал отображать содержимое таблицы до того, как таблица будет полностью загружена. Тег <colgroup> был введен в HTML для того, чтобы уменьшить код, формирующий HTML таблицы.
Тег <colgroup> можно использовать как контейнер для тега <col>. Из названия тега <colgroup> следует, что он предназначен для объединения колонок таблицы в группы и выделения этих групп.
Тег <colgroup>. Синтаксис тега <colgroup>.
Тег <colgroup> является тегом, у которого закрывающий тег ставится опционально, то есть, вы можете писать закрывающий тег, а можете не писать его. Обычно закрывающий тег не пишется и тег <colgroup> используется как одиночный тег, но если вы используете элемент <colgroup>, как контейнер для элементов <colgroup>, то закрывающий тег следует написать.
[php]
<table>
<colgroup width=”500”>
<tr>
<td></td>
</tr>
</table>
[/php]
Тег <colgroup>. Атрибуты тега <colgroup>.
Тег <colgroup> из группы HTML таблиц, имеет атрибуты событий и универсальные HTML атрибуты. Для тега <colgroup> доступны уникальные HTML атрибуты:
- align – атрибут align задает горизонтальное выравнивание содержимого колонки(по центру, по краю и т.д.)
- width – атрибут width задает ширину колонки
- span – при помощи атрибута span задается число колонок, к которым будет применены характеристики
- char – в значение атрибута char указывается символ, по которому будут выровнено содержимое колонки
- charoff – атрибут charoff принимает любое целое отрицательное или положительное число и смещает содержимое ячейки влево или вправо на заданное число символов
- valign – атрибут valign выравнивает содержимое колонки по вертикали
Теги для создания таблицы HTML
В языке HTML имеется целая группа тегов предназначенных для формирования HTML таблиц.
Теги формирующие таблицы HTML:
Тег <colgroup>. Пример использования тега <colgroup>.
[php]
<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN» «http://www.w3.org/TR/html4/loose.dtd»>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Таблица HTML</title>
<link rel="stylesheet" href="style.css" type="text/css" >
</head>
<body>
<table border="1" rules="groups">
<caption>Заголовок HTML таблицы</caption>
<colgroup width="150">
<colgroup align="center" width="50">
</colgroup>
<tr>
<td> </td><td>1 курс</td><td>2 курс</td><td>3 курс</td>
<td>4 курс</td><td>5 курс</td>
</tr>
<tr>
<td>Иванов</td><td>хор</td><td>отл</td><td>удвл</td><td>хор</td>
<td>хор</td>
</tr>
<tr>
<td>Петров</td><td>неуд</td> <td>хор</td><td>удвл</td><td>отл</td>
<td>хор</td>
</tr>
<tr>
<td>Сидоров</td><td>хор</td><td>хор</td><td>хор</td><td>отл</td>
<td>отл</td>
</tr>
</table>
</table>
</body>
</html>
[/php]
Если вы скопируете пример в текстовый редактор(рекомендую Notepad++, бесплатный редактор с подсветкой синтаксиса), а затем запустите его в браузере, то увидите:
На этом всё, спасибо за внимание, надеюсь, что был хоть чем-то полезен и до скорых встреч на страницах блога для начинающих вебразработчиков и вебмастеров ZametkiNaPolyah.ru
Выберете удобный для себя способ, чтобы оставить комментарий