Maison > Article > interface Web > Définir le nombre de colonnes en HTML pour s'étendre
Définir le nombre de colonnes en HTML pour s'étendre
- WBOYavant
- 2023-09-04 22:13:021428parcourir
我们在这篇文章中要执行的任务是在HTML中设置要跨越的列数。
当使用
Colspan属性
在HTML中，单元格应该跨越的列数是由colspan属性指定的。它使得单个表格单元格可以跨越多个列或单元格。它提供了与电子表格程序（如Excel的“合并单元格”功能）相同的功能。
语法
下面是colspan属性的语法。
<td colspan="number">
让我们深入以下示例，更好地理解colspan属性。
Example 1
的中文翻译为：示例1
在以下示例中，我们使用colspan来进行表格的合并单元格。
<!DOCTYPE html>
<html>
<head>
<style>
body {
text-align: center;
}
table,
tbody,
td {
border: 1px solid black;
border-collapse: collapse;
}
</style>
</head>
<body>
<table>
<tr>
<th>NAME</th>
<th>Amount</th>
</tr>
<tr>
<td>Surya</td>
<td>143</td>
</tr>
<tr>
<td>Karthik</td>
<td>420</td>
</tr>
<tr>
<td colspan="2">Total Amount : 563</td>
</tr>
</table>
</body>
</html>
当脚本被执行时，它将生成一个输出，显示由脚本中给定的数据组成的表格，同时在网页上显示总金额的colspan。
Example 2
的中文翻译为：示例2
让我们来看下面的例子，其中我们使用了
<!DOCTYPE html>
<html>
<head>
<style>
article {
columns: 3;
}
h1 {
column-span: all;
}
</style>
</head>
<body>
<article>
<h1>spanning all of the columns</h1>
<p>Mahendra Singh Dhoni is an Indian former professional cricketer who was captain of the Indian national cricket team in limited-overs formats</p>
<p>Virat Kohli is an Indian international cricketer and former captain of the India national cricket team.He plays for Delhi in domestic cricket</p>
<p>Hardik Himanshu Pandya is an Indian international cricketer who plays for the India national cricket team at the international level and the Baroda cricket team domestically.</p>
</article>
</body>
</html>
在运行上述脚本时，它将生成一个输出，其中包含脚本中使用的文本以及网页上的colspanCe qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Déclaration：
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer