tr vAlign 屬性
tr 對(duì)象定義和用法
vAlign 屬性設(shè)置或返回?cái)?shù)據(jù)在行中的垂直對(duì)齊方式。
語法
設(shè)置 vAlign 屬性:
trObject.vAlign="baseline|bottom|middle|top"
返回 vAlign 屬性:
trObject.vAlign
值 | 描述 |
---|---|
baseline | 與基線對(duì)齊。 |
bottom | 對(duì)內(nèi)容進(jìn)行下對(duì)齊。 |
middle | 對(duì)內(nèi)容進(jìn)行下對(duì)齊。 |
top | 對(duì)內(nèi)容進(jìn)行上對(duì)齊。 |
瀏覽器支持
所有主流瀏覽器都支持 vAlign 屬性
實(shí)例
實(shí)例
下面的例子更改了單元格內(nèi)數(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 對(duì)象
更多建議: