tr vAlign 屬性
tr 對象定義和用法
vAlign 屬性設置或返回數(shù)據(jù)在行中的垂直對齊方式。
語法
設置 vAlign 屬性:
trObject.vAlign="baseline|bottom|middle|top"
返回 vAlign 屬性:
trObject.vAlign
值 | 描述 |
---|---|
baseline | 與基線對齊。 |
bottom | 對內容進行下對齊。 |
middle | 對內容進行下對齊。 |
top | 對內容進行上對齊。 |
瀏覽器支持
所有主流瀏覽器都支持 vAlign 屬性
實例
實例
下面的例子更改了單元格內數(shù)據(jù)的垂直排列方式:
<html>
<head>
<script>
function displayResult()
{
document.getElementById('tr2').vAlign="top";
}
</script>
</head>
<body>
<table width="50%" border="1">
? <tr id="tr1">
??? <th>Firstname</th>
??? <th>Lastname</th>
??? <th>Text</th>
? </tr>
? <tr id="tr2">
??? <td>Peter</td>
??? <td>Griffin</td>
??? <td>Hello my name is Peter Griffin.
??? I need a long text for this example.
??? I need a long text for this example.</td>
? </tr>
</table>
<br>
<button type="button" onclick="displayResult()">Top-align content</button>
</body>
</html>
<head>
<script>
function displayResult()
{
document.getElementById('tr2').vAlign="top";
}
</script>
</head>
<body>
<table width="50%" border="1">
? <tr id="tr1">
??? <th>Firstname</th>
??? <th>Lastname</th>
??? <th>Text</th>
? </tr>
? <tr id="tr2">
??? <td>Peter</td>
??? <td>Griffin</td>
??? <td>Hello my name is Peter Griffin.
??? I need a long text for this example.
??? I need a long text for this example.</td>
? </tr>
</table>
<br>
<button type="button" onclick="displayResult()">Top-align content</button>
</body>
</html>
嘗試一下 ?
tr 對象
更多建議: