Tabellen in HTML aufteilen und zusammenführen (colspan, rowspan)

Der Code demonstriert die horizontale Zusammenführung:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <Kopf>
        <meta http-equiv="Inhaltstyp" content="text/html; charset=UTF-8">
        <title>Demonstration Tabellen-Tag 2 - Zellenzusammenführung</title>
        <style type="text/css">
            td{
                Textausrichtung: zentriert;
            }
        </Stil>
    </Kopf>
    <Text>
        <table border="1" cellspacing="0" width="50%" height="150">
            <caption>Zellen horizontal zusammenführen</caption>
<!--colspan muss die Anzahl der zusammenzuführenden Spalten angeben, also ob es zwei oder drei Spalten sind usw.-->        
            <tr> <th colspan="2">Name und Alter</th> <th>Telefonnummer</th> </tr>
            <tr> <td>Jacke</td> <td>24</td> <td>1351234567</td> </tr>
            <tr> <td>Tom</td> <td>22</td> <td>1351234567</td> </tr>
            <tr> <td>Rose</td> <td>22</td> <td>1351234567</td> </tr>
            <tr> <td>Mehr</td> <td>25</td> <td>1351234567</td> </tr>
        </Tabelle>
        <br/>

        <table border="1" cellspacing="0" width="50%" height="150">

Laufergebnisse:

這里寫圖片描述

Der Code demonstriert die vertikale Zusammenführung:

<table border="1" cellspacing="0" width="50%" height="150">
            <caption>Zellen vertikal zusammenführen</caption>
            <tr><th>Klasse</t> <th>Name</th><th>Alter</th> <th>Telefon</th> </tr>
            <tr><td rowspan="2">Klasse 601</td> <td>Jack</td> <td>24</td> <td>1351234567</td> </tr>
            <tr> <td>Tom</td> <td>22</td> <td>1351234567</td> </tr>
<!--rowspan muss die Anzahl der zusammenzuführenden Spalten angeben, also ob es sich um zwei oder drei Zeilen handelt usw.-->    
            <tr><td rowspan="3">Klasse 602</td> <td>Rose</td> <td>22</td> <td>1351234567</td> </tr>
            <tr> <td>Mehr</td> <td>25</td> <td>1351234567</td> </tr>
            <tr> <td>Li Si</td> <td>25</td> <td>1351234567</td> </tr>
        </Tabelle>
    </body>
</html>

Laufergebnisse:

這里寫圖片描述

Dies ist das Ende dieses Artikels über das Teilen und Zusammenführen von Tabellen (Colspan, Rowspan) in HTML. Weitere verwandte Inhalte zum Teilen und Zusammenführen von Tabellen finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!

<<: Beispielcode zur Implementierung eines zufälligen Roll Callers in HTML

>>: So fixieren Sie Inhalte beim Scrollen einer HTML-Seite an einer festen Position