Фон таблицы при помощи атрибута bgcolor.

Уроки HTML для начинающих.
Таблица HTML (урокN8)

В этом уроке(N8) мы с Вами будем раскрашивать наши таблицы.
Можно закрасить всю таблицу целиком: для этого внутри тега <table>напишем <table bgcolor="код HTML или название цвета RGB">

Вот пример:

ячейка 1	ячейка 2
ячейка 3	ячейка 4

А вот код нашей таблицы:

<table bgcolor="#cc33cc" border="1">
<tr>
<td>ячейка 1</td>
<td>ячейка 2</td>
</tr>
<tr>
<td>ячейка 3</td>
<td>ячейка 4</td>
</tr>
</table>

---

А сейчас атрибут bgcolor пропишем для тега tr, и мы получим цветную строку:

ячейка 1	ячейка 2
ячейка 3	ячейка 4

А вот код нашей таблицы:

<table border="1">
<tr bgcolor="#669900">
<td>ячейка 1</td>
<td>ячейка 2</td>
</tr>
<tr bgcolor="#FF6633">
<td>ячейка 3</td>
<td>ячейка 4</td>
</tr>
</table>

---

Таким образом можно "нарисовать" компьютерную радугу:
Я добавила атрибут width это мы с Вами проходили (урокN2)атрибуты - wıdth,heıght ЗДЕСЬ

ячейка 1

ячейка 2

ячейка 3

ячейка 4

ячейка 5

ячейка 6

ячейка 7

А вот код нашей таблицы:

<table width="350" style="text-align:center">
<tr bgcolor="#6633FF">
<td>ячейка 1</td>
</tr>
<tr bgcolor="#FFFF00">
<td>ячейка 2</td>
</tr>
<tr bgcolor="#99CC00">
<td>ячейка 3</td>
</tr>
<tr bgcolor="#FF6633">
<td>ячейка 4</td>
</tr>
<tr bgcolor="#CC99FF">
<td>ячейка 5</td>
</tr>
<tr bgcolor="#66CCFF">
<td>ячейка 6</td>
</tr>
<tr bgcolor="#FF66CC">
<td>ячейка 7</td>
</tr>
</table>

---

А сейчас атрибут bgcolor пропишем для тега td, и мы получим цветные ячейки:

ячейка 1	ячейка 2
ячейка 3	ячейка 4

А вот код нашей таблицы:

<table border="1">
<tr>
<td bgcolor="#FFFF00">ячейка 1</td>
<td bgcolor="#00FFFF">ячейка 2</td>
</tr>
<tr>
<td bgcolor="#FF0000">ячейка 3</td>
<td bgcolor="#FF6699">ячейка 4</td>
</tr>
</table>

---

А сейчас вместо цвета, пропишем в стиле ссылку на картинку. Вот сама картинка (фон):

Я пользуюсь Radikal.ru

Скопируем адрес картинки (1 код) и вставим его в ниже приведённый код.

<table style="background:url
('http://i055.radikal.ru/1003/9b/467b21cdae3a.gif')">
<tr>
<td>Текст на фоне картинки</td>
</tr>
</table>

---

На этом урок заканчивается))Что не понятно пишите,будем разбираться вместе.

• Атрибуты таблицы. ЗДЕСЬ.
• Все цвета интернета ЗДЕСЬ
• Подобрать HTML код в ручную ЗДЕСЬ
• Коды цветов HTML ЗДЕСЬ


Понравился пост - добавь в закладки, чтобы не потерять:

Похожие по тематике посты - еще почитать:

.