Атрибут valign
Синтаксис
(X)HTML
<td valign="[значение]"> ... </td>
Описание
Атрибут / параметр valign (от англ. "vertical alignment" ‒ «вертикальное выравнивание») устанавливает вертикальное выравнивание содержимого ячейки данных таблицы.
CSS
Аналог: vertical-align: <значение>;
Поддержка браузерами
Chrome
Поддерж.
Firefox
Поддерж.
Opera
Поддерж.
Maxthon
Поддерж.
IExplorer
Поддерж.
Safari
Поддерж.
iOS
Поддерж.
Android
Поддерж.
Спецификация
| Верс. | Раздел |
|---|---|
| HTML | |
| 2.0 | |
| 3.2 | Tables |
| 4.01 | 11.3.2 Horizontal and vertical alignment valign = top|middle... DTD: Transitional
Strict
Frameset
|
| 5.0 | |
| 5.1 | |
| XHTML | |
| 1.0 | Extensible HyperText Markup Language DTD: Transitional
Strict
Frameset
|
| 1.1 | Extensible HyperText Markup Language |
Значения
- baseline
- Содержимое ячейки выравнивается по базовой линии.
- bottom
- Содержимое ячейки выравнивается по нижней границе ячейки.
- middle
- Содержимое ячейки выравнивается (вертикально) по центру ячейки.
- top
- Содержимое ячейки выравнивается по верхней границе ячейки.
Значение по умолчанию: «middle».
Пример использования
Листинг кода
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Параметр valign (Элемент td)</title>
<style type="text/css">td[valign] { font-weight: bold; }</style>
</head>
<body>
<h1>Пример использования атрибута "valign"</h1>
<table border="1" style="width: 150px; height: 150px;">
<caption>Математическая матрица</caption>
<tbody align="center">
<tr> <td valign="top">0</td> <td>2</td> <td>6</td> <td>3</td> </tr>
<tr> <td>1</td> <td valign="middle">0</td> <td>4</td> <td>2</td> </tr>
<tr> <td>2</td> <td>2</td> <td valign="bottom">0</td> <td>3</td> </tr>
<tr> <td>3</td> <td>2</td> <td>6</td> <td valign="baseline">0</td> </tr>
</tbody>
</table>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Параметр valign (Элемент td)</title>
<style type="text/css">td[valign] { font-weight: bold; }</style>
</head>
<body>
<h1>Пример использования атрибута "valign"</h1>
<table border="1" style="width: 150px; height: 150px;">
<caption>Математическая матрица</caption>
<tbody align="center">
<tr> <td valign="top">0</td> <td>2</td> <td>6</td> <td>3</td> </tr>
<tr> <td>1</td> <td valign="middle">0</td> <td>4</td> <td>2</td> </tr>
<tr> <td>2</td> <td>2</td> <td valign="bottom">0</td> <td>3</td> </tr>
<tr> <td>3</td> <td>2</td> <td>6</td> <td valign="baseline">0</td> </tr>
</tbody>
</table>
</body>
</html>
Параметр valign (Элемент td)