CSS - caption-side Property
The caption-side property specifies where the table caption should be displayed (top or bottom).
Possible Values
top − Places the caption's element box above the table box.
bottom − Places the caption's element box below the table box.
Applies to
All the HTML positioned element.
DOM Syntax
object.style.captionSide = "top";
Example
Here is the example showing the usage of this property −
<html> <head> <style> caption.top {caption-side: top} caption.bottom {caption-side: bottom} </style> </head> <body> <div> <h2>caption-side: top</h2> <table style = "width: 400px; border: 2px solid black;"> <caption class = "top"> This caption will appear at the top of the table. </caption> <tr><td >Data 1</td></tr> <tr><td >Data 2</td></tr> </table> </div> <div> <h2>caption-side: bottom</h2> <table style = "width: 400px; border: 2px solid black;"> <caption class = "bottom"> This caption will appear at the bottom of the table. </caption> <tr><td >Data 1</td></tr> <tr><td >Data 2</td></tr> </table> </div> </body> </html>
Advertisements
To Continue Learning Please Login
Login with Google