УРОК "Как изменить в таблице цвет фона, границ, строк, ячеек и столбцов"
Пишите на сайтах красиво!
УРОК «Как изменить в таблице цвет фона, строк, ячеек и столбцов»
Дорогие друзья!
Цветом можно выделить в таблице:
фон, на котором расположена таблица,
границы вокруг таблицы и вокруг ячеек,
строку с названиями заголовков столбцов,
столбец с заголовками строк,
отдельные строки или столбцы,
отдельные ячейки,
заголовок таблицы или её "подвал".
Для того, чтобы задать цвет фона, на котором расположена таблица, цвет строк или ячеек, в теге table
(для всей таблицы), в теге tr (для строк) и в теге td или th (для ячеек) используется атрибут
bgcolor="код цвета" с указанием названия цвета или (лучше всего) его кода:
Пример кода:
Результат:
Заголовок таблицы
Строка 1 Ячейка 1
Строка 1 Ячейка 2
Строка 2 Ячейка 1
Строка 2 Ячейка 2
Строка 3 Ячейка 1
Строка 3 Ячейка 2
Обратите внимание, что хотя код заголовка таблицы находится внутри кода таблицы,
он не окрашивается в цвет фона. Кроме того, если у вас задан цвет отдельных ячеек и строк, то промежутки
между ячейками будут цвета фона таблицы (зелёного в нашем случае).
Если вы хотите изменить цвет столбцов, то вам нужно будет прописать цвет в тег td каждой ячейки этого столбца.
А вот если вы хотите, чтобы фоном таблицы, строк или ячеек был не просто цвет, а какая-то картинка-фон, то
вместо bgcolor нужно использовать атрибут background="адрес картинки", например:
Результат:
Заголовок таблицы
Строка 1 Ячейка 1
Строка 1 Ячейка 2
Строка 2 Ячейка 1
Строка 2 Ячейка 2
Строка 3 Ячейка 1
Строка 3 Ячейка 2
Для изменения цвета границ таблицы служит атрибут тега table bordercolor="цвет",
он же применяется и для изменения цвета рамки вокруг ячейки таблицы (прописывается как атрибут тега td). Попробуйте поэкспериментировать сами:
скопируйте код таблицы в текстовый редактор и пропишите в коде цвет границ таблицы и цвет границ какой-либо ячейки.
Затем сохраните изменения и откройте документ в браузере.