Логотип schoolsw3.com
Учебники Справочники Упражнения КАК? Меню
Создать
Редактор Поддержка Форум

×
Учебники
Справочники
Упражнения
Пожертвовать Обновление Реклама Видео Магазин

HTML Справочник

HTML Теги по алфавиту HTML Теги по категориям HTML Поддержка браузера HTML Атрибуты тегов HTML Глобальные атрибуты HTML События атрибутов HTML Название цвета HTML Canvas HTML Аудио/видео HTML Наборы символов HTML Типы документов HTML URL Кодировка HTML Код языка HTML Код страны HTTP Сообщения ошибок HTTP Методы GET/POST HTML Конвертер PX в EM HTML Комбинация клавиш

HTML Теги

Тег <!--Комментарий--> Тег <!DOCTYPE> Тег <a> Тег <abbr> Тег <acronym> Тег <address> Тег <applet> Тег <area> Тег <article> Тег <aside> Тег <audio> Тег <b> Тег <base> Тег <basefont> Тег <bdi> Тег <bdo> Тег <big> Тег <blockquote> Тег <body> Тег <br> Тег <button> Тег <canvas> Тег <caption> Тег <center> Тег <cite> Тег <code> Тег <col> Тег <colgroup> Тег <data> Тег <datalist> Тег <dd> Тег <del> Тег <details> Тег <dfn> Тег <dialog> Тег <dir> Тег <div> Тег <dl> Тег <dt> Тег <em> Тег <embed> Тег <fieldset> Тег <figcaption> Тег <figure> Тег <font> Тег <footer> Тег <form> Тег <frame> Тег <frameset> Тег <h1> - <h6> Тег <head> Тег <header> Тег <hr> Тег <html> Тег <i> Тег <iframe> Тег <img> Тег <input> Тег <ins> Тег <kbd> Тег <label> Тег <legend> Тег <li> Тег <link> Тег <main> Тег <map> Тег <mark> Тег <meta> Тег <meter> Тег <nav> Тег <noframes> Тег <noscript> Тег <object> Тег <ol> Тег <optgroup> Тег <option> Тег <output> Тег <p> Тег <param> Тег <picture> Тег <pre> Тег <progress> Тег <q> Тег <rp> Тег <rt> Тег <ruby> Тег <s> Тег <samp> Тег <script> Тег <section> Тег <select> Тег <small> Тег <source> Тег <span> Тег <strike> Тег <strong> Тег <style> Тег <sub> Тег <summary> Тег <sup> Тег <svg> Тег <table> Тег <tbody> Тег <td> Тег <template> Тег <textarea> Тег <tfoot> Тег <th> Тег <thead> Тег <time> Тег <title> Тег <tr> Тег <track> Тег <tt> Тег <u> Тег <ul> Тег <var> Тег <video> Тег <wbr>


HTML Тег <colgroup>



Пример

Установите цвет фона трех столбцов с тегами <colgroup> и <col>:

<table>
  <colgroup>
    <col span="2" style="background-color:red">
    <col style="background-color:yellow">
  </colgroup>
  <tr>
    <th>ISBN</th>
    <th>Заголовок</th>
    <th>Прайс</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>Мой первый HTML</td>
    <td>$53</td>
  </tr>
</table>
Попробуйте сами »


Определение и использование <colgroup>

Тег <colgroup> задает группу из одного или нескольких столбцов в таблице для форматирования.

Тег <colgroup> полезен для применения стилей ко всем столбцам, вместо того чтобы повторять стили для каждой ячейки, для каждой строки.

Примечание: Тег <colgroup> должен быть ребенком элемента <table>, после элемента <caption> и перед элементами <thead>, <tbody>, <tfoot>, и <tr>.

Совет: Чтобы определить различные свойства столбца в пределах <colgroup>, используйте тег <col> в теге <colgroup>.


Поддержка браузеров <colgroup>

Элемент
<colgroup> Да Да Да Да Да

Атрибуты <colgroup>

Атрибут Значение Описание
span number Указывает количество столбцов, которые должна охватывать группа столбцов

Глобальные атрибуты <colgroup>

Тег <colgroup> также поддерживает Глобальные атрибуты в HTML.


События атрибутов <colgroup>

Тег <colgroup> также поддерживает События атрибутов в HTML.


Еще примеры <colgroup>

Пример

Выравнивание текста в столбцах таблицы (с помощью CSS):

<table style="width:100%">
  <tr>
    <th>ISBN</th>
    <th>Заголовок</th>
    <th>Прайс</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>Мой первый HTML</td>
    <td style="text-align:right">$53</td>
  </tr>
  <tr>
    <td>2489604</td>
    <td>Мой первый CSS</td>
    <td style="text-align:right">$47</td>
  </tr>
</table>
Попробуйте сами »
Пример

Вертикальное выравнивание текста в столбцах таблицы (с помощью CSS):

<table style="height:200px">
  <tr>
    <th>Месяц</th>
    <th style="vertical-align:bottom">Сбережения</th>
  </tr>
  <tr>
    <td>Январь</td>
    <td style="vertical-align:bottom">$100</td>
  </tr>
</table>
Попробуйте сами »
Пример

Укажите ширину столбца таблицы (с помощью CSS):

<table>
  <tr>
    <th style="width:200px">Месяц</th>
    <th>Сбережения</th>
  </tr>
  <tr>
    <td>Январь</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>Февраль</td>
    <td>$80</td>
  </tr>
</table>
Попробуйте сами »

Связные страницы <colgroup>

HTML DOM справочник: Объект colgroup


Настройки CSS по умолчанию <colgroup>

Большинство браузеров будут отображать элемент <colgroup> со следующими значениями по умолчанию:

Пример
colgroup {
  display: table-column-group;
}
Попробуйте сами »