資料結構
網路
RDBMS
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化學
生物
數學
英語
經濟學
心理學
社會研究
時尚研究
法律研究如何建立一個帶標題的表格？
我們使用 <caption> 標籤在 HTML 中建立一個具有標題的表格。caption 標籤將被插入在 <table> 標籤之後。我們只能為一個表格新增一個標題。預設情況下，此標籤居中對齊。我們可以使用 align CSS 屬性更改對齊方式。
語法
以下是 HTML 標題標籤的語法
<caption>Caption of the table...</caption>
示例 1
在以下示例中，我們將使用 Employees 作為標題來建立員工姓名和員工 ID 的表格。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> table, tr, th, td { border: 1px solid black; } </style> </head> <body> <table> <caption>Employees</caption> <tr> <th>EmployeeName</th> <th>EmployeeId</th> </tr> <tr> <td>Yadav</td> <td>022</td> </tr> <tr> <td>Abdul</td> <td>025</td> </tr> <tr> <td>Jason</td> <td>208</td> </tr> </table> </body> </html>
align 屬性
我們可以使用 align CSS 屬性更改對齊方式。以下為此提供語法 −
<caption style="text-align:value" >Caption of the table...</caption>
示例 2
在下面給出的示例中，我們正在使標題與頁面的左側對齊 −
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> table,tr,th,td { border:1px solid black; } </style> </head> <body> <table> <caption style="text-align: left">Employees</caption> <tr> <th>EmployeeName</th> <th>EmployeeId</th> </tr> <tr> <td>Yadav</td> <td>022</td> </tr> <tr> <td>Abdul</td> <td>025</td> </tr> <tr> <td>Jason</td> <td>208</td> </tr> </table> </body> </html>
示例 3
讓我們看另一個建立標題的示例 −
<!DOCTYPE html> <html> <head> <style> table, td, th { border: 1px solid black; } </style> </head> <body> <table> <caption>Authors</caption> <tr> <th>JavaFX</th> <th>Krishna</th> </tr> <tr> <td>Scala</td> <td>Satish</td> </tr> </table> </body> </html>
更新於： 18-Oct-2022
704 次瀏覽
廣告