HTML表格标题居中显示
在HTML中，我们可以使用CSS样式来实现表格标题的居中显示，下面我们将详细介绍如何使用内联样式、内部样式和外部样式表来实现表格标题的居中显示。
1、内联样式
内联样式是指直接在HTML标签中使用style属性来设置样式，对于表格标题，我们可以在<th>标签中使用style属性来设置字体居中。
<table>
<tr>
<th style="text-align: center;">姓名</th>
<th style="text-align: center;">年龄</th>
</tr>
<tr>
<td>张三</td>
<td>25</td>
</tr>
</table>
2、内部样式
内部样式是指在HTML文档的<head>标签中使用<style>标签来定义样式，对于表格标题，我们可以在<style>标签中为<th>标签设置text-align: center;样式。
<!DOCTYPE html>
<html>
<head>
<style>
table th {
text-align: center;
}
</style>
</head>
<body>
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>25</td>
</tr>
</table>
</body>
</html>
3、外部样式表
外部样式表是指将CSS代码保存在一个单独的.css文件中，然后在HTML文档中使用<link>标签引用该文件，对于表格标题，我们可以在外部样式表中为<th>标签设置text-align: center;样式。
创建一个名为styles.css的外部样式表文件，并添加以下内容：
table th {
text-align: center;
}
在HTML文档中引用该外部样式表：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>25</td>
</tr>
</table>
</body>
</html>
相关问题与解答
1、如何设置表格标题字体大小？
答：可以使用内联样式或内部样式为<th>标签设置font-size属性。
<th style="text-align: center; font-size: 18px;">姓名</th>
原创文章，作者：K-seo，如若转载，请注明出处：https://www.kdun.cn/ask/213653.html
微信扫一扫 