HTML DOM td / th vAlign property
td / th objects Definition and Usage
vAlign property sets or returns the vertical arrangement of the data within the cell.
grammar
Setting vAlign properties:
tdObject.vAlign="baseline|bottom|middle|top"
或者
thObject.vAlign="baseline|bottom|middle|top"
或者
thObject.vAlign="baseline|bottom|middle|top"
Back vAlign properties:
tdObject.vAlign
或者
thObject.vAlign
或者
thObject.vAlign
| 值 | 描述 |
|---|---|
| baseline | 与基线对齐。 |
| bottom | 对内容进行下对齐。 |
| middle | 对内容进行下对齐。 |
| top | 对内容进行上对齐。 |
Browser Support
All major browsers support vAlign property
Examples
Examples
The following example changes the vertical arrangement of the cells within the data:
<! DOCTYPE html>
<Html>
<Head>
<Meta charset = "utf-8">
<Title> This tutorial (w3big.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"> Hello, my name is Peter, I need to demonstrate a long text, I need to demonstrate a long text. </ Td>
</ Tr>
</ Table>
<br>
<Button type = "button" onclick = "displayResult ()"> Align content up </ button>
</ Body>
</ Html>
<Html>
<Head>
<Meta charset = "utf-8">
<Title> This tutorial (w3big.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"> Hello, my name is Peter, I need to demonstrate a long text, I need to demonstrate a long text. </ Td>
</ Tr>
</ Table>
<br>
<Button type = "button" onclick = "displayResult ()"> Align content up </ button>
</ Body>
</ Html>
try it"
td / th objects