XHTML-Einführungstutorial: Anwendung von Tabellen-Tags
|
<br />Tabelle ist ein umständliches Tag in XHTML, daher müssen Sie es nur in diesem Abschnitt verstehen. Bevor CSS populär wurde, wurden Tabellen häufig zur Positionierung verwendet. In XHTML wird die Positionierung von Tabellen nicht empfohlen und das W3C hofft, dass CSS <table> bei der Positionierung ersetzen kann. Da die Verwendung von CSS-Layouts jedoch häufig viel handgeschriebenen Code erfordert (gängige Webdesign-Software wie Dreamweaver unterstützt die Anzeige von div nicht perfekt), wird <table> von vielen Websites immer noch für das Layout von Homepages verwendet. Beispielsweise verwendet die Seite „Weitere Produkte“ von Google Tabellen zur Positionierung. Ich persönlich empfehle Ihnen jedoch, CSS zur Positionierung Ihrer Seiten zu verwenden, da sich das Web in diese Richtung bewegt. Natürlich kann das Ersetzen von Tabellen durch CSS in der Anfangsphase große Probleme verursachen. Tabellen-Tag <table> In XHTML ist das Tag zum Erstellen einer Tabelle <table>. Beim Schreiben des Codes verwenden wir zuerst das Tag <tr>, um die Tabelle in Zeilen zu unterteilen, und verwenden dann das Tag <td>, um jede Zeile in Zellen zu unterteilen. Es ist sehr schwierig und ineffizient, eine Tabelle vollständig durch handschriftlichen Code zu erstellen. Das Erstellen einer Tabelle in einer Software zur Webseitenerstellung ist jedoch genauso einfach wie in Word. Sie müssen nur einfache Eigenschaften wie Zeilen und Spalten auswählen. Es kann jedoch vorkommen, dass die automatisch generierte Tabelle die Anforderungen nicht erfüllt und im Codemodus angepasst werden muss. Daher müssen wir weiterhin über ein allgemeines Verständnis der spezifischen Schreibmethoden von XHTML-Tabellen-Tags verfügen. Eigenschaften der Tabellenränder Das <table>-Tag kann ein Rahmenattribut haben. Wenn Sie für die Rahmeneigenschaft keinen Wert festlegen, zeigt der Browser den Tabellenrahmen standardmäßig nicht an. Tabellenübung Lassen Sie uns ein Etikett mit vier Zeilen und zwei Spalten erstellen. Der Code lautet wie folgt: <table border="1"> <tr> <td>ein Gitter</td> <td>ein Gitter</td> </tr> <tr> <td>ein Gitter</td> <td>ein Gitter</td> </tr> <tr> <td>ein Gitter</td> <td>ein Gitter</td> </tr> <tr> <td>ein Gitter</td> <td>ein Gitter</td> </tr> </Tabelle> Die angezeigten Ergebnisse sind wie folgt: Beachten Sie den obigen Code, es gibt 4 Paare von <tr>, die den 4 Zeilen darunter entsprechen. Und jede <tr> (Zeile) hat zwei <td>-Zellen. Es wird also eine Tabelle mit 4 Zeilen und 2 Spalten. Zum Auflisten von Daten und anderen Informationen reicht eine Tabelle mit derartigen Rastern aus, Tabellen zur Positionierung sind jedoch in der Regel komplizierter. Wir betonen noch einmal, dass wir die Verwendung von Tabellen zur Positionierung nicht empfehlen. Deshalb stellen wir <table> hier nur kurz vor. |
<<: jQuery implementiert ein atmendes Karussell
>>: Docker-Compose erstellt schnell Schritte für ein privates Docker-Warehouse
Artikel empfehlen
Fallbeispiel zur TypeScript-Schnittstellendefinition
Die Rolle der Schnittstelle: Schnittstelle, auf E...
MySQL-Schleife fügt zig Millionen Daten ein
1. Erstellen Sie eine Testtabelle Tabelle `mysql_...
So verteilen Sie mit CSS zwei Schaltflächen auf der linken und rechten Seite desselben übergeordneten Tags
In diesem Artikel wird hauptsächlich die Methode ...
Zusammenfassung der Funktionsweise von JS auf Seiten innerhalb und außerhalb von Iframes
Inhaltsverzeichnis Holen Sie sich den Inhalt des ...
Detaillierte Beschreibung der Unicode-Signatur-BOM
Unicode-Signatur-BOM – Was ist die BOM? BOM ist di...
Konfigurationsschema für die MySQL-Master-Slave-Synchronisierung unter dem Centos7-System
Vorwort Bei der Arbeit an einem Hochverfügbarkeit...
Einfaches HTML-Applet für Einkaufsmengen
Dieser Artikel stellt Ihnen ein einfaches HTML-Ap...
Zusammenfassung der Tipps zum Erstellen von Webseiten
Vorwort Dieser Artikel fasst hauptsächlich einige...
Problem mit fehlgeschlagener tzselect-Einstellungszeit in Ubuntu20, Raspberry Pi-Server (empfohlen)
Ich habe meinen Raspberry Pi-Server vor zwei Tage...
Erfahrung mit parallelen React-Funktionen (gleichzeitiger Front-End-Modus)
React ist eine Open-Source-JavaScript-Bibliothek,...
Detaillierte Erklärung der Serveroptionen von Tomcat
1. Konfiguration Die ersten beiden sind standardm...
Detaillierte Erklärung dieser Zeigerfunktion in JS
Die Pfeilfunktion ist eine neue Funktion in ES6. ...
Erste Schritte Tutorial für Anfänger: Domänennamenauflösung und Bindung
Wie können Sie also nach der Registrierung eines ...
Zusammenfassung der CSS-Schwebeelementanalyse
Float: links/rechts/keine; 1. Gleichstufiges Schw...
Vue3.0 verwendet das Plug-In vue-grid-layout, um Drag-Layout zu implementieren
Inhaltsverzeichnis 1. Plugins 2. Zwischenspiel 3....