Если вы хотите стилизовать два первых столбца таблицы, используйте
и
элементы.
ПН
ТУ
СРЕДА
ЧТ
ПТ
СБ
ВС
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
Элемент
следует использовать в качестве контейнера для столбца
технические характеристики.
Каждая группа определяется элементом
.
Атрибут span указывает, сколько столбцов получает стиль.
Атрибут стиля указывает стиль, который следует задать для столбцов.
Примечание: Существует очень ограниченный выбор допустимых свойств CSS для colgroups.
Пример
ПН
ВТ
WED
THU
…
Попробуйте сами »
Примечание: Тег
должен быть
дочерний элемент
и должен быть помещен
перед любыми другими элементами таблицы, например <заголовок> ,
,
д., но после элемента
, если
подарок.
Юридические свойства CSS
Существует очень ограниченный набор свойств CSS, которые разрешено использовать в colgroup:
. ширина свойство видимость свойство фон свойства граница свойства
Все остальные свойства CSS не будут влиять на ваши таблицы.
Несколько элементов столбца
Если вы хотите оформить больше столбцов с разными стилями, используйте больше
элементов внутри
:
Пример
ПН
ВТ
СР
ЧТ
…
Попробуйте сами »
Пустые группы
Если хочешь
чтобы стилизовать столбцы в середине таблицы, вставьте «пустой»
Элемент (без
стили) для столбцов до:
Пример
<столбец
диапазон = "2"
>
ПН
ВТ
WED
ЧТ
. ..
Попробуйте сами »
Скрыть столбцы
Вы можете скрыть столбцы со свойством видимости : свернуть :
Пример
ПН
ВТ
СР
ЧТ
…
Попробуйте сами »
❮ Предыдущий
Следующий ❯
ВЫБОР ЦВЕТА
Лучшие учебники
Учебник по HTML Учебник по CSS Учебник по JavaScript Учебник How To Учебник по SQL Учебник по Python Учебник по W3.CSS Учебник по Bootstrap Учебник по PHP Учебник по Java Учебник по C++ Учебник по jQuery
51
Справочник по HTML Справочник по CSS Справочник по JavaScript Справочник по SQL Справочник по Python Справочник по W3. CSS Справочник по Bootstrap Справочник по PHP Цвета HTML Справочник по Java Справочник по Angular Справочник по jQuery
W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения.
Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания.
Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования,
куки-файлы и политика конфиденциальности.
Copyright 1999-2022 Refsnes Data. Все права защищены. W3Schools работает на основе W3.CSS.
Раскрашивание таблицы HTML
В этом посте вам будет показано, как вы можете изменить цвет шрифта и цвет фона ячеек по вашему желанию.
Чтобы сделать HTML-таблицу визуально привлекательной, ее можно раскрасить. В этом посте вам будет показано, как вы можете редактировать цвет шрифта и цвет фона ячеек по вашему желанию.
Например, ниже я добавил таблицу с текущим положением команд Формулы-1. Чтобы было легче узнавать команды, я раскрасил ячейки в цвета команд.
Кроме того, я изменил цвет шрифта «Ferrari» и «Red Bull» на белый, чтобы получить лучший контраст.
Команда
Очки
Мерседес
438
Феррари
288
Ред Булл
244
Код HTML для этой таблицы выглядит следующим образом:
Команда
Очки
Мерседес
438
Феррари
288
Ред Булл
<тд>244тд>
таблица>
Здесь важно отметить позицию, в которую вы добавляете атрибуты.
Между скобками
вы будете только раскрашивать ячейку. Если вы добавите цвет в скобки
, будет отформатирована вся строка.
Цвет фона ячейки
Чтобы изменить цвет фона ячейки на серебристый, необходимо изменить скобки
на
. После этого вы вводите обычный текст, который должен отображаться в ячейке.
Мерседес
`
Цвет шрифта
Изменение цвета шрифта на белый требует изменения скобок
на
. В данном примере это было объединено с новым цветом фона. Несколько атрибутов разделены пробелами:
Red Bull
Цветовые коды HTML
К цветам в HTML можно обращаться по-разному. С одной стороны, можно просто назвать цвет, например, «серебристый» или «темно-синий». Это работает хорошо, но приводит к относительно небольшой цветовой палитре.