Wie Zeilen und Spalten in der HTML5-Tabelle zu überspannen
Manchmal müssen Sie ein wenig mehr Flexibilität in Ihrem HTML5 Tabellenentwurf. Werfen Sie einen Blick auf eine Seite aus einem täglichen Planer bösen Oberherr. ein böser Oberherr zu sein, ist eindeutig ein komplexes Geschäft. Elemente aus einem Code Standpunkt, dass mehr als eine Zelle nehmen sind die interessantesten. Entwerfen Fallen nimmt zwei Morgen und Unterschlupf zu verbessern dauert drei.
Menu
Werfen Sie einen Blick auf den Code, und Sie werden sehen, wie es funktioniert:
tableSpan.html Mit colspan und rowspan
| Montag | Dienstag | Mittwoch | Donnerstag | Freitag | |
|---|---|---|---|---|---|
| Frühstück | in Höhle | mit Kumpanen | in Höhle | in Höhle | in Höhle |
| Morgen | Design-Fallen | verbessern Hideout | |||
| Nachmittag | Zug Günstlinge | Zug Günstlinge | Zug Günstlinge | Zug Günstlinge | Weltherrschaft |
| Abend | manaical Lachen | manaical Lachen | manaical Lachen | manaical Lachen |
Das Geheimnis zu machen Zellen größer ist als der Standardwert ist zwei spezielle Attribute: und.
Wie man über mehrere Spalten erstrecken
Die Morgen-Aktivitäten sind in der Regel über mehrere Tage zu passieren. Designing Traps werden sowohl Montag und Dienstag Morgen nehmen, und das Versteck verbessern die restlichen drei Morgen besetzen. Nehmen Sie noch einen Blick auf den Morgen row- hier ist, wie dies geschehen ist:
Morgen Design-Fallen verbessern Hideout
Die Design-Traps Zelle erstreckt sich über zwei normale Spalten. Das Attribut gibt an, wieviele Spalten diese Zelle stattfinden wird.
The Morning Zeile dauert noch sechs Spalten auf. Das ist eine Spalte in der Breite, wie normal, aber das Design Traps Zelle erstreckt sich über zwei Spalten und die Verbesserung der Hideout Zelle dauert drei, die breite sechs Spalten beträgt. Wenn Sie die Breite einer Zelle zu erhöhen, müssen Sie einige andere Zellen in der Zeile zu beseitigen zu kompensieren.
Wie man mehrere Zeilen erstrecken
Eine verwandte Eigenschaft - - ermöglicht eine Zelle mehr als eine Zeile einer Tabelle zu übernehmen. Sehen Sie in der Freitag Spalte zurück, und Sie werden die Weltherrschaft Zelle nimmt zwei Zeitschlitze zu sehen. (Wenn die Weltherrschaft war einfach, jeder würde es tun.) Hier ist der entsprechende Code:
Nachmittag Zug Günstlinge Zug Günstlinge Zug Günstlinge Zug Günstlinge Weltherrschaft Abend manischen Lachen manischen Lachen manischen Lachen manischen Lachen
Die Abend-Reihe hat nur fünf Einträge, weil die Weltherrschaft Zelle in den Raum erstreckt, die normalerweise von einem Paar besetzt werden würde.
Skizzieren Sie heraus, was Sie zuerst erreichen möchten.