Главная страница Карта сайта Написать письмо

HTML, Excel, Word, SEO   учебник HTML (хтмл) таблицы html
JavaScript + DHTML HTML Word Excel VBA Графика Свой сайт Free soft вебмастера SEO-новости Статьи
HTML профессионально
Учебник HTML (хтмл)
...Старт
...Основные тэги
...Заголовки и комментарии
...Специальные символы
...Форматирование текста ч.1
...Форматирование текста ч.2
...Форматирование текста ч.3
...Создание списков
...Работа с графикой ч.1
...Работа с графикой ч.2
...Работа с графикой ч.3
...Работа с графикой ч.4
...Таблицы ч.1
...Таблицы ч.2
...Таблицы ч.3
...Гиперссылки
...Фреймы
...Что такое формы
...Что такое JavaScript
...Маленькие секреты Вэб-дизайна
...Эффект постепенной прорисовки
...Карта ссылок
...Внутренний лист стилей
...Работа с листами стилей
...Свойства шрифта - font
...Свойства текста
...Свойство фона - background
...Рамки и размеры
...Относительное и абсолютное позиционирование элементов
...Основные мета тэги
...Таблица дескрипторов HTML и их атрибутов
...Таблица свойств css
...Заключительное слово
HTML-редакторы
...Что такое HTML-редактор
...FrontPage 2003
...Adobe GoLive CS
...Macromedia Dreamweaver MX 2004
...HomeSite
...CuteSite Builder
...Namo WebEditor
...CoffeeCup HTML Editor
...1stPage 2000
...Arachnophilia
...HotDog Professional
...CSE HTML Validator Pro
 
 

«создание таблиц  ||  язык HTML  ||  вид таблиц»

Таблицы html страницы (ч.2)

Задание цвета элементов таблицы

Графический фон таблицы

Выравнивание данных в таблице

Изменение размеров таблицы

Задание цвета элементов таблицы html страницы

При помощи атрибута BGCOLOR можно изменять цвет содержимого ячейки, строки, группы столбцов, крупы строк, таблицы целиком.

Цвет можно задать как наименованием цвета, так и шестнадцатеричным значением кода цвета со знаком #.

Пример:

HTML-код:


<table border="1">

 <tr bgcolor="#ff00ff">

  <td>1</td>

  <td>2</td>

 </tr>

 <tr bgcolor="#5555ff">

  <td>3</td>

  <td>4</td>

 </tr>

</table>

Отображение в браузере:


1 2
3 4
Графический фон таблицы html страницы

При помощи атрибута BACKGROUND можно задать графический фон ячейки или таблицы целиком. Если размеры изображения превышают габариты ячейки или таблицы, для которых оно предназначено, браузер обрезает изображение таким образом, чтобы оно уместилось в пределах соответствующего объекта.

Пример:

HTML-код:


<table background="img/sea.jpg">

 <tr>

  <td>11111</td>

  <td>22222</td>

 </tr>

 <tr>

  <td>33333</td>

  <td>44444</td>

 </tr>

</table>

Отображение в браузере:


11111 22222
33333 44444
Выравнивание данных в таблице html страницы

Для выравнивания данных в таблице предназначены атрибуты ALIGN, VALIGN.

Атрибут ALIGN предназначен для выравнивания по горизонтали. По умолчанию содержимое заголовков выравнивается по центру, а ячеек - влево.

Атрибут VALIGN выравнивает данные по вертикали. По умолчанию информация выравнивается посередине. Средствами выравнивания можно пользоваться в отдельной ячейке, строке, группе столбцов, группе строк. Самым высоким приоритетом обладает атрибут выравнивания в ячейках таблицы.

Если вы ограничиваете расстояние между содержимым ячейки и ее кромками при помощи атрибута CELLPADDING, то это сказывается на результате выравнивания. Например, при CELLPADDING=3 и ALIGN="top", данные будут размещены на расстоянии трех пикселей от верхней границы ячейки.

Пример:

HTML-код:


<table border="1" cellpadding="5">

 <tr>

  <td align="right">1111<br>2222</td>

  <td valign="top" align="center">22222</td>

 </tr>

 <tr>

  <td>Нижняя ячейка</td>

  <td>Нижняя ячейка</td>

 </tr>

</table>

Отображение в браузере:


1111
2222		 22222
Нижняя ячейка Нижняя ячейка
Изменение размеров таблицы html страницы

Ширина таблицы задается атрибутом WIDTH. Значение можно задавать как в абсолютных единицах (WIDTH=250), так и в относительных (WIDTH="80%"). Например, задав значение ширины в 600 пикселей, можно быть уверенным, что таблица поместится в окне браузера при любом разрешении монитора.

То же самой можно делать и с высотой таблицы при помощи атрибута HEIGHT.

При задании чрезмерно малых величин ширины и высоты таблицы, браузер определяет минимальные значения, которые позволяют нормально отображать данные.

Все вышесказанное относится и к ячейкам таблицы. При этом вовсе не обязательно задавать размеры каждой отдельной ячейки. При изменении ширины ячейки все соседние ячейки в пределах столбца будут отображаться с учетом нового значения. То же справедливо и в отношении высоты ячейки.

Пример:

HTML-код:


<table border="1" width="200">

 <tr>

  <td><p>Ширина 200 пикселей</p></td>

 </tr>

</table>

<br>

<table border="1" width="60%">

 <tr>

  <td><p>Ширина 60%</p></td>

 </tr>

</table>

Отображение в браузере:


Ширина 200 пикселей

Ширина 60%

top

«создание таблиц  ||  язык HTML  ||  вид таблиц»
Рекомендую
Смотреть все книги»
 
 
 
БОНУС

Спасибо, что заглянули на сайт. Надеюсь, Вам понравилось. Заходите еще. Здесь всегда рады вам :)
При копировании материалов, размещенных на сайте, ссылка на первоисточник обязательна.

© 2008
Айнур Турушев All Rights Reserved

  

E-mail:
sozdaysait@narod.ru

Хостинг от uCoz