So verwenden Sie das Colspan-Attribut-HTML-Tutorial-php.cn

Heim

Web-Frontend

HTML-Tutorial

So verwenden Sie das Colspan-Attribut

Feb 11, 2019 pm 01:33 PM

HTML中的colspan属性指定单元格应跨越的列数。它允许单个表格单元格跨越多个单元格或列的宽度。colspan属性实现的功能与Excel中的电子表格程序的“合并单元格”的功能相同。

So verwenden Sie das Colspan-Attribut

在创建HTML表时，colspan属性可以与和元素一起使用。

colspan属性与标签一起使用时，colspan属性决定了它应该跨越的标准单元格的数量。

colspan属性与标签一起使用时，colspan属性决定了它应该跨越的标题单元格的数量。

我们来看具体的示例

与标签一起使用
代码如下
<!DOCTYPE So verwenden Sie das Colspan-Attribut> <So verwenden Sie das Colspan-Attribut> <head> <title>HTML colspan</title> <style> table, th, td { border: 1px solid black; border-collapse: collapse; padding: 6px; } </style> </head> <body style = "text-align:center"> <table> <tr> <th>名称</th> <th>价格</th> </tr> <tr> <td>樱桃</td> <td>$10</td> </tr> <tr> <td>草莓</td> <td>$8</td> </tr>  <tr>  <td colspan="2">总价: $18</td> </tr> </table> </body> </So verwenden Sie das Colspan-Attribut>
Nach dem Login kopieren
效果如下：
与标签一起使用
代码如下
<!DOCTYPE So verwenden Sie das Colspan-Attribut> <So verwenden Sie das Colspan-Attribut> <head> <title>HTML colspan</title> <style> table, th, td { border: 1px solid black; border-collapse: collapse; padding: 6px; } </style> </head> <body style = "text-align:center"> <table> <tr> <th colspan="2">价格</th> </tr> <tr> <td>樱桃</td> <td>$10</td> </tr> <tr> <td>$8</td> </tr> </table> </body> </So verwenden Sie das Colspan-Attribut>
Nach dem Login kopieren
效果如下：

本篇文章到这里就全部结束了，更多有关前端的精彩内容大家可以关注php中文网的其他相关栏目教程！！！

Das obige ist der detaillierte Inhalt vonSo verwenden Sie das Colspan-Attribut. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn