key Войти Валюта:
calendar 09.06.2016
heart 499
question Комментариев: 0

За добавление таблиц в HTML-документе отвечает тег <table>. Данный тег является контейнером для элементов, из которых “строится” таблица. Речь идет, например, о тегах <tr> и <td> (или <th>). Например:

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>TABLE</title>

</head>

<body>

<table border="1" width="100%" cellpadding="5">

 <tr>

  <th>ячейка  1</th>

  <th>ячейка 2</th>

 </tr>

 <tr>

  <td>ячейка 3</td>

  <td>ячейка 4</td>

</tr>

</table>

</body>

</html>

Таблица в браузере:

Основные атрибуты тега <table>

Рассмотрим основные атрибуты тега <table>:

  • За выравнивание таблицы отвечает атрибут align, имеющий несколько значений: left, right и center.

  • Цвет и фон задается при помощи атрибута bgcolor, а толщина границ вокруг таблицы  и между ячейками “устанавливается” атрибутом border.

  • Расстояние между границей ячейки и содержимым задает атрибут cellpadding, а расстояние между внешними границами ячеек ー cellspacing.

  • Число столбцов в ячейке прописывается при помощи атрибута cols, а ширина таблицы устанавливается атрибутом width.

Основные атрибуты тега <td>

Рассмотрим основные атрибуты тега <td>:

  • Выравнивание содержимого по горизонтали делается при помощи атрибута align (допустимы значения  left, right и center).

  • Цвет фона ячейки устанавливает атрибут bgcolor, число ячеек объединенных по горизонтали ー colspan, число ячеек объединенных по  вертикали ー rowspan, а высота ячеек ー height.

  • Атрибут valign позволяет выровнять содержимое ячейки по вертикали (допустимы значения top, middle, bottom, baseline).

  • Ширина ячейки устанавливается атрибутом width.

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

Атрибут align тега <table> позволяет не только выровнять таблицу, но и разместить ее “внутри” текста. Например:

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>Выравнивание таблицы по правому краю</title>

</head>

<body>

<table width="200" bgcolor="#E6E6FA" cellspacing="0" cellpadding="4" border="2" align="right">

 <tr><td>Таблица</td></tr>

</table>

<p>Атрибут align тега <table> позволяет не только выровнять таблицу, но и разместить ее “внутри” текста.</p>

</body>

</html>

Таблица в браузере:

soc-1
Tweet
© СХОСТ. All Rights Reserved.