HTML DOM TFoot vAlign Property
Last Updated :
25 Feb, 2022
The HTML DOM TFoot vAlign property is used to set or return the value of the vAlign attribute of the <tfoot> element. The vAlign attribute is used to specify the vertical alignment of the text content inside the table footer element.
Note: This property is no longer supported in HTML5.
Syntax
- It returns the TFoot vAlign property.
TFootobject.vAlign;
- It sets the TFoot vAlign property.
TFootobject.vAlign = "top|middle|bottom|baseline";
Property Values:
- top: It sets the content to the top-align.
- middle: It sets the content to middle-align.
- bottom: It sets the content to the bottom-align.
- baseline: It sets the context to baseline. The baseline is the line where most of the characters sit. It has a default value.
Return Value: It returns a string value that represents the <tfoot> element vertical alignment.
Example 1: Below HTML code illustrates how to return the TFoot vAlign property.
HTML
<!DOCTYPE html>
<html>
<head>
<style>
table,
th,
td {
border: 1px solid green;
}
</style>
</head>
<body>
<center>
<h1>
GeeksforGeeks
</h1>
<p><b>HTML DOM TFoot vAlign Property</b></p>
<table>
<thead>
<tr>
<td>Username</td>
<td>User_Id</td>
</tr>
</thead>
<tbody>
<tr>
<td>Shashank</td>
<td>@shashankla</td>
</tr>
</tbody>
<tfoot id="GFG" align="left" valign="top">
<tr>
<td>GeeksforGeeks</td>
<td>@geeks</td>
</tr>
</tfoot>
</table>
<br>
<button onclick="btnclick()">
Click here
</button>
<p id="paraID"></p>
</center>
<script>
function btnclick() {
var x = document.getElementById("GFG").vAlign;
document.getElementById("paraID").innerHTML = x;
}
</script>
</body>
</html>
|
Output:
Example 2: The below code illustrates how to set the TFoot vAlign Property.
HTML
<!DOCTYPE html>
<html>
<head>
<style>
table,
th,
td {
border: 1px solid green;
}
</style>
</head>
<body>
<center>
<h1>
GeeksforGeeks
</h1>
<p><b>HTML DOM TFoot vAlign Property </b></p>
<table>
<thead>
<tr>
<td>Username</td>
<td>User_Id</td>
</tr>
</thead>
<tbody>
<tr>
<td>Shashank</td>
<td>@shashankla</td>
</tr>
</tbody>
<tfoot id="GFG" align="left" valign="top">
<tr>
<td>GeeksforGeeks</td>
<td>@geeks</td>
</tr>
</tfoot>
</table>
<br>
<button onclick="btnclick()">
Click here
</button>
<p id="paraID"></p>
</center>
<script>
function btnclick() {
var x = document.getElementById(
"GFG").vAlign = "baseline";
document.getElementById(
"paraID").innerHTML = x;
}
</script>
</body>
</html>
|
Output:
Supported Browsers:
- Google Chrome
- Firefox
- Internet Explorer
- Opera
- Apple Safari
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...