Баст      БАСТ                  Дополнение 1
 
Главная страница
Краткий курс по созданию сайтов
Урок №1
Урок №2
Урок №3
Урок №4
Урок №5
Урок №6
Урок №7
Урок №8
Урок №9
Урок №10
Урок №11
Урок №12
Урок №13
Урок №14
Урок №15
Урок №16
Урок №17
Урок №18
Урок №19
Урок №20
Урок №21
Урок №22
Урок №23
 

Урок №10


Таблицы (продолжение).

     Атрибуты для табличных строк <tr>:

  • align=left | center | right | justify | char     Выравнивание по горизонтали. Общий атрибут align в теге <table> определяет выравнивание содержимого всех ячеек. Для определения расположения данных в конкретном ряду таблицы этот атрибут используют в дескрипторе <tr>, где
    • left - выравнивание по левому краю,
    • center - выравнивание по центру,
    • right - выравнивание по правому краю,
    • justify - выравнивание по левому и по правому краю,
    • char - выравнивание по указанному символу.
  • bgcolor="Цвет"     Цвет фона.
  • bordercolor="Цвет"     Цвет рамки.
  • bordercolordark="Цвет"     Темный цвет рамки.
  • bordercolorlight="Цвет"     Светлый цвет рамки.
  • char="символ"     Этот атрибут задает символ, по которому выравниваются данные в ячейке (например, по десятичной запятой).
  • valign=top | middle | bottom | baseline     Выравнивание содержимого ячейки по вертикали.
    • top - выравнивание по верхнему краю.
    • middle - центрирует по вертикали (это значение атрибута испльзуется по умолчанию).
    • bottom - выравнивание по нижнему краю.
    • baseline - выравнимание по самой верхней текстовой строке.

Если вы прошли первые уроки, то указанная выше информация не является очень трудной и новой.

Рассмотрим примеры.

Используем сразу несколько атрибутов в строках таблицы.

<table border=1>
<tr bgcolor=blue> <th>Заголовок №1</th> <th>Заголовок №2</th> <th>Заголовок №3</th> </tr>
<tr bordercolor=red> <td>Ячейка 1-2</td> <td>Ячейка 2-2</td> <td>Ячейка 2-3</td> </tr>
<tr valign=top> <td>Ячейка 1-3<br>Выравниваем содержимое по верхнему краю.</td> <td>Ячейка 2-3</td> <td>Ячейка 3-3</td> </tr>
<tr valign=bottom> <td>Ячейка 1-4<br>Выравниваем содержимое по нижнему краю.</td> <td>Ячейка 2-4</td> <td>Ячейка 3-4</td> </tr>
</table>


Получится следующее:

Заголовок №1 Заголовок №2 Заголовок №3
Ячейка 1-2 Ячейка 2-2 Ячейка 2-3
Ячейка 1-3
Выравниваем содержимое по верхнему краю.
Ячейка 2-3 Ячейка 3-3
Ячейка 1-4
Выравниваем содержимое по нижнему краю.
Ячейка 2-4 Ячейка 3-4





Второй пример

<table border=2>
<tr bordercolorlight=navy align=right> <th>Заголовок №1</th> <th>Заголовок №2</th> <th>Заголовок №3</th> </tr>
<tr bordercolor=green align=center> <td>Ячейка 1-2</td> <td>Ячейка 2-2</td> <td>Ячейка 2-3</td> </tr>
<tr bordercolordark=red> <td>Ячейка 1-3</td> <td>Ячейка 2-3</td> <td>Ячейка 3-3</td> </tr>
</table>

Получится следующее:

Заголовок №1 Заголовок №2 Заголовок №3
Ячейка 1-2 Ячейка 2-2 Ячейка 2-3
Ячейка 1-3 Ячейка 2-3 Ячейка 3-3



Напишите свой собственный HTML-документ, применяя все уже известные теги (дескрипторы).

     Сохраните этот файл, как 10.html.


 


© 2005 БАСТ
Hosted by uCoz