Zusammenfassung der HTML-Tabellenkenntnisse-HTML-Tutorial-php.cn

Zusammenfassung der HTML-Tabellenkenntnisse

小云云

Freigeben： 2017-11-17 14:29:28

Original

2028 Leute haben es durchsucht

Um in die Tür der Programmierer zu treten, müssen wir den Weg über HTML gehen. Nur wenn wir grundlegendes HTML beherrschen, können wir die nächste Technologie besser erlernen. Deshalb werden wir heute alle Aspekte des Wissens im Zusammenhang mit HTML-Tabellen teilen.

1. Markierung

a, Grundformat

b, Attribut des Tabellen-Tags

Breitenattribut: stellt die Breite der Tabelle dar, sein Wert kann Pixel (px) oder 100 % (%) der Höhe des übergeordneten Elements

sein Attribut: Gibt die Höhe der Tabelle an. Sein Wert kann Pixel (px) oder Prozentsatz (%) des übergeordneten Elements sein

　 Randattribut: Gibt die Breite des äußeren Randes der Tabelle an

Attribut ausrichten: Die Anzeigeposition der Tabelle, der Wert links wird links angezeigt, der Wert wird in der Mitte angezeigt, der Wert wird rechts angezeigt, der Standardwert ist links

　 Cellspacing-Attribut: the Abstand der Zellenzeit, der Standardwert ist 2 Pixel, die Einheit Pixel ist

　 Cellpadding-Attribut: Zelle Der Anzeigeabstand zwischen dem Inhalt und dem Zellrand in Pixeln

Rahmenattribut: steuert die Anzeige Abstand des Tabellenrandes

void (Standardwert) bedeutet kein Rand

oben bedeutet nur der obere Rand. Mit Rändern

　unten bedeutet nur der untere Rand.

hsides bedeutet nur den oberen und unteren Rand

lhs bedeutet nur den linken Rand

　rhs bezeichnet nur den rechten Rand

vsides bezeichnet nur den linken und rechten Rand

Feld enthält alle 4 Ränder

Rand enthält alle 4 Ränder

Regeln Eigenschaften: Steuern Sie, ob und wie die Trennlinien zwischen Zellen angezeigt werden

Keine (Standardwert) bedeutet keine Trennlinien

Alle bedeutet einschließlich aller Trennlinien

Zeilen bedeutet nur Zeilentrennlinien

Clos bedeutet nur Spaltentrennlinien

Gruppen bedeutet, dass es welche gibt Trennlinien nur zwischen Zeilenkombinationsspaltengruppen

c, ein einfaches Webseitenlayout erstellen

2, Verwendungszweck Wenn die Tabelle einen Titel verwenden muss, können Sie das Tag verwenden. Die Einfügeposition des Attributs liegt direkt nach dem Attribut oben in der Tabelle

unten: Der Titel wird unten in der Tabelle platziert

links: Der Titel wird links in der Tabelle platziert

rechts : Der Titel wird auf der rechten Seite der Tabelle platziert

3, Mark

a, definiert eine Zeile der Tabelle, für jede Tabellenzeile wird sie durch a dargestellt Paar ... Tags können mehrere -Tags enthalten, optionale Attribute

Legen Sie das horizontale Ausrichtungsformat fest: align="color value"

unten: nach oben ausrichten

oben: nach unten ausrichten

Mitte: nach oben ausrichten

a, und , erscheint paarweise

b, ist die Tabellenüberschrift, die sich normalerweise in der ersten Zeile oder Spalte befindet, während nicht

　c, ist eine Datenmarkierung, die die spezifischen Daten von

d angibt, die Markierungsattribute beider sind gleich

e, die Attribut

bgcolor: Zellenhintergrund festlegen

align: Zellenhintergrund festlegen

valign: Vertikale Zellenausrichtung festlegen

Breite: Zellenbreite festlegen

Height: Zellenhöhe festlegen

Rowspan: Anzahl der mit Zellen belegten Zeilen festlegen

Clospan: Anzahl der mit Zellen belegten Spalten festlegen

z. B.:

Das Obige sind einige verwandte Inhalte der grundlegendsten HTML-Tabelle. Füllen Sie ein Formular gemäß dem obigen Tutorial aus. Ich glaube, Sie werden viel gewinnen.

Verwandte Empfehlungen:

Eine umfassende Einführung in die Eigenschaften von HTML-Tabellen

HTML-Tabellen neu entdecken

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>表格</title>
</head>
<body>
    <table width="960" height="250" border="1" cellpadding="10" frame="box" >
        <caption>表格的标题</caption>
    <tr bgcolor="#ccc">
        <th bgcolor="red">班级</th>
        <th>姓名</th>
        <th>年级</th>
        <th>成绩</th>
    </tr>
    <tr>
        <td>四年级一班</td>
        <td>张三</td>
        <td>16</td>
        <td>80</td>
    </tr>
        <tr>
        <td>四年级一班</td>
        <td>李四</td>
        <td>16</td>
        <td>70</td>
    </tr>
        <tr>
        <td>四年级一班</td>
        <td>王五</td>
        <td>16</td>
        <td>60</td>
    </tr>
    </table>
</body>
</html>

Nach dem Login kopieren

Detaillierte Einführung in HTML-Tabellen

Praktische Verwendung des HTML-Tabellenlayouts

Erklärung von Beispielen für das HTML-Tabellenlayout

Das obige ist der detaillierte Inhalt vonZusammenfassung der HTML-Tabellenkenntnisse. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!