td/th vAlignプロパティ

td/th 对象参考手册td/th オブジェクト

定義と用法

vAlign プロパティは、セル内のデータの垂直方向の配置を設定または返します。

構文

vAlign プロパティを設定する:

tdObject.vAlign="baseline|bottom|middle|top"

または

thObject.vAlign="baseline|bottom|middle|top"

vAlign プロパティを返す:

tdObject.vAlign

または

thObject.vAlign

值 説明
baseline ベースラインに揃えます。
bottom コンテンツを下揃えにします。
middle コンテンツを中央揃えにします。
top コンテンツを上揃えにします。


ブラウザサポート

Internet ExplorerFirefoxOperaGoogle ChromeSafari

すべての主要ブラウザは vAlign プロパティをサポートしています。


例

例

次の例では、セル内のデータの垂直方向の配置を変更します。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>サンプル(example.com)</title>
<script>
function displayResult(){
    document.getElementById('td1').vAlign="top";
    document.getElementById('td2').vAlign="top";
    document.getElementById('td3').vAlign="top";
}
</script>
</head>
<body>

<table width="50%" border="1">
    <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Text</th>
    </tr>
    <tr>
        <td id="td1">Peter</td>
        <td id="td2">Griffin</td>
<td id="td3">こんにちは、私の名前はPeterです。デモには長いテキストが必要です。デモには長いテキストが必要です。</td>
    </tr>
</table>
<br>
<button type="button" onclick="displayResult()">コンテンツを上揃え</button>

</body>
</html>

試してみる »


td/th 对象参考手册td/th オブジェクト その他の拡張