HTML Geben Sie das Bild in die Zelle ein. Fast Standardmodus

1. Was ist HTML-Tische und warum brauchen sie?

hTML-Tabelle - Dies ist eine der grundlegendsten Komponenten jeder HTML-Seite bzw. jeder Website. Beispielsweise besteht die Site-Site alle aus Tabellen: Bilder, Texte, Links, Anmeldeformulare - alles wird relativ zueinander unter Verwendung von HTML-Tischen (eigentlich der gesamten Site befindet sich auch in einer großen Tabelle).

2. Was sind die Tags von HTML-Tischen?

StichworteDie Angabe der HTML-Tabelle ist wie folgt geschrieben:

Da wir jedoch wissen, bestehen alle Tabellen aus Zeilen und Spalten (Zellen), sodass Sie Tags und für sie einstellen müssen:

- HTML-Linientabelle
- Säule (Zelle) HTML-Tabelle.

Und jetzt versuchen wir, alle Tags in einem Tisch zu verschmelzen. Dazu erstellen wir eine HTML-Tabelle, die aus zwei Zeilen und drei Spalten besteht:

Dieses HTML ist sehr einfach gemacht. Um damit zu beginnen, setzen wir die Tags des Tisches selbst, innen, in denen wir die erforderliche Anzahl von Zeilen (in unser Beispiel 2 Zeilen) einsetzen:




Dann wird jede Zeichenfolge mit Spalten-Tags in Zellen unterteilt:



- Zelle 1.1.
- Zelle 1.2.
- Zelle 1.3.


- Zelle 2.1.
- Zelle 2.2.
- Zelle 2.3.

Tatsächlich ist die erste Zahl in Inschriften eine Zahlenzahl, und die zweite Zellennummer (1x2 ist die erste Reihe, die zweite Zelle usw.).

3. So stellen Sie die Hintergrundfarbe der HTML-Tabellen ein?

Und nun können wir damit umgehen, wie der Hintergrund des Tisches oder jeder Zelle separat angegeben ist.

Das Attribut wird also verwendet, um den Hintergrund einzustellen bGColor \u003d "color_fon".

Wenn Sie beispielsweise eine Farbe für die gesamte Platte einstellen müssen, ist es so ausgeführt:

bGColor \u003d "color_fon">

- Zelle 1.1.
- Zelle 1.2.
- Zelle 1.3.


- Zelle 2.1.
- Zelle 2.2.
- Zelle 2.3.

Wenn Sie beispielsweise ein gelbes Tablet erstellen müssen, schreiben wir:

Wenn benötigt stellen Sie die Hintergrundfarbreihe ein HTML-Tabellen, dann das Attribut bGColor \u003d "color_fon" Auf das Tag anwenden :

bGColor \u003d "# FFFF00">
bGColor \u003d "# 0000ff">









1.1 1.2 1.3
2.1 2.2 2.3
1.1 1.2 1.3
2.1 2.2 2.3

In diesem Fall das Attribut telefonnummer Gibt die weiße Farbe dem Text im Tag an.

In ähnlicher Weise das farbe jeder Zelle separat. Wenn Sie beispielsweise die Farbe der Zelle 1.2 auf dem Blau ändern müssen, dann in dem Öffnungskennzeichen Attribut bGColor \u003d "color_fon":

4. So legen Sie die Breite und Höhe der HTML-Zellen des Tisches ein?

Um also manuell die Breite und Höhe der Zellen einzustellen, verwenden Sie die Attribute der Höhe und Breite. Sie können für die gesamte Tabelle für eine Zeile für Zelle (Säule) eingestellt werden. Höhe und Breite können sowohl in Pixel als auch in Prozentsätzen eingestellt werden. In unserem Fall setzen wir die Breite und Höhe in Pixel für Säulen (Zellen).

höhe - Attributeinstellung der Höhe der Zelle

breite - Attribut, das die Breite der Zelle definiert

Und jetzt am Beispiel:

Jetzt werde ich erklären, warum wir die Höhe der Zellen nur einmal in jeder Zeile einstellen.

Wenn Sie in einer Nummer für jede Zellenhöhe fettig angeben, als für andere, sind alle Zellen (Säulen) Ihrer Zeile höchste Höhe. Und die Breite jeder Zeile ist am besten separat eingestellt!

Sie können die Höhe und Breite für die gesamte Tabelle einstellen. In diesem Fall werden alle Zellen (Säulen) und die Zeilen durch den ihnen gegebenen Raum geteilt, wenn Sie diese Parameter nicht persönlich angeben (als Prozentsatz der Gesamtbreite (Höhe) des Tisches oder Pixels).

Außerdem müssen Sie auch Höhenhöhen- und Breitbreite einstellen in Perkenten:

Zellinhalt

Wenn wir eine Breite von 40 Prozent für eine Zelle angeben, wie in unserem Beispiel, bedeutet dies, dass wir weitere 60 Prozent für den Rest der Zellen haben, d. H. Die Menge ihrer Breite sollte 60 Prozent nicht überschreiten. Alles ist sehr einfach: In der Menge, in der wir nur 100% haben. Wir glauben: 100 - 40 \u003d 60.

5. So richten Sie Text in der HTML-Tabelle aus?

Und nun können wir es herausfinden, wie Sie den Text in unserer HTML-Tabelle am linken Rand am rechten Rand und in der Mitte ausrichten können.

Dies erfolgt mit dem Attribut:

aLIGN \u003d "LINKS" - Level Text in HTML-Tischen am linken Rand

align \u003d "Center" - Ebenen hTML-Text Tabellen in der Mitte

richten \u003d "Rechts" - Text in HTML-Tischen am rechten Rand

Dementsprechend kann das ALIGN-Attribut mehr rechte und linke Werte annehmen. Begründen Sie den Wert, wenn Sie mit dem Tag verwendet werden ARIGN-Attribut kann nicht empfangen werden.

Beispielsweise, hTML Quelltext Tische, deren Text in der Mitte ausgerichtet ist, sieht so aus:

align \u003d "Center">










aLIGN \u003d "LINKS"\u003e 1x1. align \u003d "Center">1.2 richten \u003d "Rechts"\u003e 1x3.
aLIGN \u003d "LINKS">2.1 align \u003d "Center"\u003e 2x2. richten \u003d "Rechts">2.3

Angabe des Attributs Align \u003d "Center" In der Öffnung

, wir haben die HTML-Tabelle in der Mitte der Browserseite genutzt.

Hier ist das Ergebnis, das Sie im Browser erreichen:

1x1. 1.2 1x3.
2.1 2x2. 2.3

Und berücksichtigen Sie nun das Beispiel, wie Sie den Text in der HTML-Tabelle über der Oberseite oder an der Unterkante ausrichten, d. H. So schaffen Sie es, so dass der Zellinhalt nicht nur genau in der Mitte ist (wie die Standardeinstellung) und auch auf die gleiche Weise unten.

Die vertikale Ausrichtung wird vom Attribut festgelegt:

Valign \u003d "top" - Der Inhalt befindet sich oben in der Zelle

valign \u003d "Mitte" - Der Inhalt befindet sich im Zellzentrum

valign \u003d "Bottom" - Der Inhalt befindet sich am Ende der Zelle

Betrachten wir diese Attribute in unserem Beispiel:












valign \u003d "top"\u003e 1x1. 1.2 valign \u003d "top"\u003e 1x3.
valign \u003d "Bottom">2.1 2x2. valign \u003d "Bottom">2.3

Das ist, was wir bekommen, wenn wir den Browser ansehen, das Ergebnis der Arbeit der Attribute ausrichten. und völlig.:

1x1. 1.2 1x3.
2.1 2x2. 2.3

6. Wie kombinieren Sie Zellen und Spalten HTML-Tische?

In diesem Teil unseres Artikels werden wir über Attribute sprechen colspan. und rowspan..

colspan. - Bestimmt die Anzahl der Spalten, die verteilt werden sollen diese zelle

Rowspan. - Bestimmt die Anzahl der Zeilen, an die diese Zelle verteilt ist

Werte colspan. und rowspan. kann einen Wert von 2 und mehr nehmen, d. H. Die Zelle kann sich in zwei oder mehr Spalten strecken (Zeile).

Nun, jetzt im Beispiel, dehnten wir die Zelle 1x1 in zwei Säulen (Zellen). Dazu verwenden wir das Attribut COLSPAN \u003d "2", das es für 1x1-Zelle spricht. Der Code sieht so aus:

Wie wir sehen, breitet sich die 1x1-Zelle auf die Länge von zwei Zellen aus. Dementsprechend ist seine Länge gleich der zusammenfassbaren Länge dieser beiden Zellen (160 Pixel). Wir haben das Breitenattribut für Zelle 1x1 nicht verschrieben, aber wenn wir uns entschieden haben, würde die Breite auf 160 Pixel gebeten werden. Und auch, dass in unserem Beispiel keine Zelle 1x3 gibt, d. H. In der ersten Reihe sind nur zwei Zellen, warum - wir haben es bereits diskutiert - der Zelle 1x1 ist dank des Colspan-Attributs gleich zwei Zellen.

Mit Colspan- und RowlowPan-Attributen müssen Sie sich sehr sorgfältig kontaktieren. Ein Fehler kann dazu führen, dass Ihre Site "gehen wird.

Und jetzt, wenn wir uns mit dem Parameter Colspan befassenLassen Sie uns mit dem Parameter Rowspan umgehen. Das Prinzip der Aktion ist derselbe:










colspan \u003d "2"> 1.1 1.2
2.1 2.2
1.1 1.2
2.1 2.2

Daher haben wir gelernt, Zellen in Zeilen und Spalten von HTML-Tischen zu kombinieren.

7. WIE ENTFERNEN, Hinzufügen oder Ändern von Einundsen und Einstellen der HTML-Frame-Tabelle?

So erstellte wir also eine HTML-Tabelle, zwischen denen zwischen den Zellen eindeutig sichtbar sind. Um sie noch besser sichtbar zu machen, lassen Sie uns einen Rahmen für unseren Tisch hinzufügen. Dies erfolgt mit Attributen:

border \u003d "Rahmenbreite in Pixel" - Setzt die Breite des Rahmens

bordercolor \u003d "Rahmenfarbe"- Setzt die Farbe des Rahmens

Lassen Sie uns beispielsweise unseren HTML-Tisch-Black-Frame-1-Pixel herstellen.

Für dieses Tag.

Attribute hinzufügen:

Jetzt sehen wir eindeutig eindeutig eindeutig zwischen den HTML-Zellen des Tisches und den Einrücken von den inneren Kanten der Zellen bis zum Text. Folglich können wir diese Retreats ohne Probleme steuern. Attribute sind dafür konzipiert:

cellspacing \u003d "Breite des Ruhestands in Pixel" - Vertiefung zwischen Zellen

cellPadding \u003d "Breite eines Indents in Pixel" - Innerhalb der Zelle eingerückt (vom Rand der Zelle zu Text, Bildern, Links ...)

Lassen Sie sich beispielsweise einen Vertiefungen zwischen den Zellen von 10 Pixeln herstellen, und der Einzug von der Kante der Zelle an den Text wird auf 20 Pixel erhöht. Dies geschieht wie folgt:

cellPadding \u003d "20"cellspacing \u003d "10">








1.1 1.2
2.1 2.2

Wenn Sie das Ergebnis im Browser ansehen, sehen wir eindeutig, dass der Abstand zwischen den Zellen ( zellspacung.) Unsere HTML-Tabelle ist auf 10 Pixel erhöht, und der Abstand zwischen dem Text und dem Innenkanal der Zelle erhöhte sich um 20 Pixel.

1.1 1.2
2.1 2.2

Wenn Sie Ingenfalls eingerichtet werden müssen, dann setzen Sie einfach ein cellpadding \u003d "0"und cellspacing \u003d "0".

8. Wie fügt eine HTML-Tabelle den anderen ein?

Wir nähern uns der letzten Bühne, um HTML-Tische zu studieren. Jetzt lernen wir, einen Tisch in das andere einzufügen.

Im Beispiel in der Zelle 1.2 legen wir eine neue Tabelle ein, bestehend aus einer Zeile und zwei Säulen. Interner HTML-Tabelle Setzen wir den roten Rahmen 2 Pixelbreite und den Abstand zwischen den Zellen 0 Pixel ein. Auch der innere Tisch, den wir an der Oberseite der Zelle platzieren.

Es ist sehr einfach gemacht:










1.1






3.13.2

2.1 2.2

Dies ist das, was als Folge neuer Transformationen unseres Tischs (rote Zellen - einen internen Tisch in einem großen Tisch) passiert ist:

1.1
3.1 3.2
2.1 2.2

Zu diesem Zeitpunkt werden wir diesen Artikel beenden. Ich denke, es stellte sich heraus, dass es sich als erfolgreich war und nicht schwer zu verstehen, und ich hoffe, Sie haben nicht mehr mit den Tischen.

Diese Tabellen spielen eine sehr wichtige Rolle beim Erstellen eines unsichtbaren Rahmens für eine Webseite. Und das wird gleichmäßig und schön den Text, Menüs, Bildern usw. helfen.
Für ein besseres Verständnis, was ich Ihnen versuche, Sie mitzuteilen, schauen Sie sich das Beispiel eines Webseitenrahmens an:

So, so erstellen Sie eine einfache Tabelle in HTML?
Um einen Tisch zu erstellen, verwenden Sie drei Tags:

Tabelle dieses Tag ist erforderlich, um den Tisch zu öffnen. Dies ist eine Art Behälter, der andere Elemente enthält. Hier trägt, so dass ohne einen Donut nicht versteht. Nichts, teilen Sie, wann Sie ein Beispiel sehen.
Schließungs-Tag. obligatorisch.

Die Tabelle besteht aus einer Reihe

Reihe 1. Reihe 1.
Serie 2. Serie 2.
Reihe 3. Reihe 3.
Zelle 1. Zelle 2.
Zelle 1. Zelle 2.
Zelle 1. Zelle 2.

Tr. Erzeugt eine neue Reihe von Tischen. Schließungs-Tag. obligatorisch.

Td. Erzeugt eine neue Zelle in einer Reihe. Schließungs-Tag. obligatorisch.

Betrachten wir ein Beispiel, um alle oben genannten besser zu verstehen:

Tabellen in HTML.

reihe 1 Cell1. range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2
reichweite 3 Zelle 1 bereich 3 Zelle 2

Hier ist das Ergebnis:

reihe 1 Cell1. range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2
reichweite 3 Zelle 1 bereich 3 Zelle 2

Lass uns alles erklären.
Vor jeder Erstellung neue Tabelle Tag eröffnet

.
Als nächstes Platz in der Mitte des Behälters
Etikett Was spricht nicht über den Beginn einer neuen Reihe.
Legen Sie in dieser Zeile zwei Zellen mit dem Inhalt mit dem Tag ein

Schließen Sie eine Anzahl von Tag .
Öffnen Sie eine andere Serie-Tag-Tag
Schließen Sie eine Anzahl von Tag .
Öffnen Sie das Tag der dritten Serie Und füge zwei Zellen wieder hinein.
Schließen Sie eine Anzahl von Tag .
Schließen Sie Table Tag.
Reihe 1 Cell1. Range1 cell2.
.

Ich denke, sie haben herausgefunden? Wenn jemand vergaß, was Attribut ist rand.Ich verwende mit dem Tag

Ich erinnere Sie daran, dass dies die Dicke des Rahmens ist. Wenn in. rand. Der Wert "0" wird eingestellt, dann sind die Grenzen des Tisches unsichtbar.

Schau in ein paar Beispiele erstellte Tabellen Und du kannst weiter gehen:

Tabellen in HTML.

zeile 1 Zelle 1
serie 2-Zelle 1

Ergebnis:

Um ein Bild in den Tisch einzufügen, müssen Sie grundsätzlich anfängliche Kenntnisse darüber besitzen, wie das Bild in der HTML-Datei eingefügt wird. Ich spreche davon. Jetzt, da Sie die Hauptnuancen über das Bild in HTML kennen, können Sie versuchen, ein Bild in den Tisch einzufügen. Dies kann wie folgt durchgeführt werden:

in der Zeichenfolge zwischen den Tags Legen Sie ein Bild ein.

Tabellen in HTML.

zeile 1 Zelle 1 reichweite 1 Zelle 2

Ergebnis:

zeile 1 Zelle 1 reichweite 1 Zelle 2

Und wie man Zellen in der Tabelle kombiniert?

Um Zellen in der Tabelle zu verschmelzen, müssen Sie solche Attribute verwenden:
Colspan. - Bestimmt die Anzahl der Spalten.
Standardwert 1.
Rowspan. - Bestimmt die Anzahl der Zeilen.
Standardwert 1.


wir kombinieren Zellen In der oberen Zeile mit dem Attribut colspan. :

Tabellen in HTML.

zeile 1 Zelle 1 + 2
serie 2-Zelle 1 zeile 2 Zelle 2

Ergebnis:

Wie soll ich die Größe der Tabelle einstellen?

Verwenden Sie solche Attribute, um die Höhe und Breite der Tabelle einzustellen:

Breite. - Tischbreite. Die Größe ist in Pixel oder Prozentsatz eingestellt.
Höhe - Tischhöhe. Die Größe ist in Pixel oder Prozentsatz eingestellt.

Tabellen in HTML.

reihe 1 Cell1.range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2

Ergebnis:

Richten Sie den Inhalt in der Tabelle aus

Um den Inhalt (Text, Bilder) in der Tabelle auszurichten, können Sie solche Attribute verwenden:

Ausrichten. - Horizontale Inhaltsausrichtung in der Tabelle.
Zuschreiben Ausrichten. Weist Werte zu: links (Standard), center, Recht.
links -
drücken Sie den Inhalt auf die linke Seite.
center -in der Mitte installieren;
recht -
drücken Sie den Inhalt zum rechten Teil

Völlig. - vertikale Ausrichtung des Inhalts in der Tabelle.
Zuschreiben Völlig. Weist Werte zu: oben, unten, mittel.
oben. drücken Sie den Inhalt nach oben.
unterseite drücken Sie den Inhalt nach unten.
mitte stellen Sie den Inhalt in der Mitte ein

Tabellen in HTML.

reihe 1 Cell1. range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2

Ergebnis:

Wie erstellt man einen Hintergrundtisch?

Sie können auch die Hintergrundtabelle für alle einzelnen Zellen vereinbaren, sowie für jede Zelle separat. Sie können den Hintergrund mit Farbe einstellen, und Sie können auch ein Bild stellen. Für den Hintergrund gibt es zwei Attribute:

Bgcolor. - Farbhintergrund der gesamten Tabelle oder jeder Zelle separat. Die Farbe wird von Code oder Word eingestellt.
Hintergrund. - Der Tisch ist in der Tabelle gefüllt.

Beachtung: Wenn Sie gehen, um die Hintergrundfarbe einzustellen oder gründungsmuster Die gesamte Tabelle, Attribute müssen im Tag installiert werden

. Und wenn nur mit einer bestimmten Zelle, dann im Tag
.

Sehen Sie sich das Beispiel an:

Tabellen in HTML.

reihe 1 Cell1. range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2

Ergebnis:

Beachtung: Wenn das Bild weniger als die Zelle ist, wird es wiederholt, bis er die Zelle bis zum Ende füllt. Wenn das Bild mehr pro Zelle ist, wird der Hintergrund des Bildes in Größengrößen geschnitten.

Und schließlich werde ich dir erzählen zwei nützliche Attribute.

Wenn Sie plötzlich den Abstand zwischen allen Zellen erhöhen möchten, helfen die folgenden Attribute:

Celcedding. - Innen zwischen dem Rahmen jeder Zelle der HTML-Tabelle und dem Inhalt darin darin.

Tabellen in HTML.

reihe 1 Cell1. range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2

Ergebnis:

reihe 1 Cell1. range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2

Zellspacung. - Übertragung zwischen den Grenzen benachbarter Zellen.

Tabellen in HTML.

reihe 1 Cell1. range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2

Ergebnis:

reihe 1 Cell1. range1 cell2.
serie 2-Zelle 1 zeile 2 Zelle 2

Fuh, erzählte!
Ich hoffe, mit der Aufgabe, die ich bewältigt und erreichbar ist, erklärte ich alles, was ich wusste hTML-Tabelle. Und ich empfehle, das Material gut sichern zu können.
Versuchen Sie, Ihren eigenen Tisch zu erstellen, und einen ganzen Rahmen für eine Webseite aus der HTML-Tabelle besser.
Alles was du gut bist!
Vielen Dank, dass Sie meinen Blog besucht haben

L yubaya. tabelle in HTML. Es ist ein Satz Zeilen und Säulen, an der Kreuzung von Zellen. Es ist einfach, Tabellen in HTML zu erstellen, es ist nur erforderlich, um sich das letzte Modell vorzustellen. In der HTML-Sprache werden die Tabellen nicht nur zur Datenvorgabe verwendet, sondern können verwendet werden, um Textblöcke, Bilder usw. zu platzieren. Auf der Webseite, d. H. Mit ihrer Hilfe können Sie ein Layout der Seite selbst erstellen.

Tabellenelement, erstellen Sie eine Tabelle

Element wird verwendet, um Tabellen in der HTML-Sprache zu erstellen. tabelleund den ganzen Code (der Inhalt) Tabellen befinden sich zwischen den Tags . Attribute dieses Elements einstellen Werte für die gesamte Tabelle:

  • hintergrund. - Das Bild ist eingestellt (URL), der Hintergrund für die gesamte Tabelle sein kann;
  • bgcolor. - Farbhintergrundtabelle, einstellen, wenn der Hintergrund nicht als Bild angegeben ist;
  • rand. - Dicke der Tischlinien, wenn die sichtbaren Grenzen nicht erforderlich sind;
  • randfarbe - Farbe der Tabelle;
  • celcedding. - Abstand von Text in den Zellen zu den Grenzen der Zellen;
  • zellspacung. - Abstand von den Grenzen des Tisches zu den äußeren Grenzen der Zellen (innerhalb des Tisches);
  • breite - Der Wert der Tabellenbreite ist eingestellt px. oder % .

Schreiben Sie ein Beispiel eines Tabellencodes mit einem blauen Hintergrund, linie dicke in 1px weiße Farbe, Arrogants innen und außen 2PX-Zellen, 100% Breite von der Seite:

bGColor \u003d "Blue" Border \u003d "1" Bordercolor \u003d "White" CellPadding \u003d "10" CellSpacing \u003d "2" Breite \u003d "100%"\u003e

Eine Zeichenfolge hinzufügen

In jeder Tabelle sollte mindestens eine Zeile sein, es wird von Tags eingestellt . Im folgenden Beispiel sehen wir ein Beispiel zum Hinzufügen einer Zeichenfolge:

bGColor \u003d "Blue" Border \u003d "1" Bordercolor \u003d "White" CellPadding \u003d "10" CellSpacing \u003d "2" Breite \u003d "100%"\u003e

Zellen hinzufügen

Zellen bilden vertikale Säulen des Tisches, sie sind mit Tags angezeigt . Fügen Sie unseren Tisch Zellen hinzu:

bGColor \u003d "Blue" Border \u003d "1" Bordercolor \u003d "White" CellPadding \u003d "10" CellSpacing \u003d "2" Breite \u003d "100%"\u003e

Zell №1.
Zelle Nr. 2.
Zellennummer 3.

In siehe resultierende Tabelle:

String kombinieren

In einigen Fällen kann es erforderlich sein, eine Spalte für mehrere Zeilen zu strecken, damit dies ein Attribut anwendet rowspan.deren Wert bestimmt die Anzahl der für die Kombination erforderlichen Zeilen. Wir sehen ein Beispiel:

BGColor \u003d "Blue" Border \u003d "1" Bordercolor \u003d "White" CellPadding \u003d "10" CellSpacing \u003d "2" Breite \u003d "100%"\u003e

rowspan \u003d "2"\u003e Reihen Nummer 1 und №2 kombiniert
Zellen-Sinne1.
CELLEN-Sinne2.

Zellennummer 3.
Zellennummer 4.

Zeile Nummer 3.
Zellennummer 5.
Zellennummer 6.

Der Browser wird angezeigt:

Zeilen Nummer 1 und №2 kombiniert Zellen-Sinne1. CELLEN-Sinne2.
Zellennummer 3. Zellennummer 4.
Zeile Nummer 3. Zellennummer 5. Zellennummer 6.

Kolonnen kombinieren.

Säulen werden mit demselben Prinzip kombiniert, nur mit dem Attribut colspan.. Wir sehen ein Beispiel:

bGColor \u003d "Blue" Border \u003d "1" Bordercolor \u003d "White" CellPadding \u003d "10" CellSpacing \u003d "2" Breite \u003d "100%"\u003e

colspan \u003d "2"\u003e Spalten №1 und №2 kombiniert
Spaltennummer 3.

Zell №1.
Zelle Nr. 2.
Zellennummer 3.

Zellennummer 4.
Zellennummer 5.
Zellennummer 6.

Der Browser wird angezeigt:

Attribute colspan. und rowspan. Sie können gleichzeitig verwenden. Im Browser sieht es so aus:

Oder so:

Und versuchen Sie, den Code selbst zu schreiben!

Abmessungen und Ausrichtetabelle

Höhe und Breite können sowohl für den gesamten Tischen als Ganzes gefragt werden, und für einzelne Linien und Spalten wird dies in einigen bekannten Attributen gemacht. breite und höheDie Werte sind sowohl in Pixel als auch in Prozent angegeben.

Die Ausrichtung der horizontalen Tabelle wird vom Attribut eingestellt ausrichten.Sie kennen bereits die Bedeutungen: links, Zentrum, rechts. Und Text in Tabellenzellen ausrichten, horizontales Ausrichtungsattribut ausrichten. müssen sich für jedes Tag anwenden td.. VON mit CSS. Es ist viel vereinfacht. Ein Attribut wird auf die vertikale Ausrichtung des Inhalts von Zellen angewendet. völlig.. Er hat auch seine Bedeutungen - vertikale Ausrichtung in der Mitte mitte, oben oben. und unten unterseite Die Basislinie (die Zeile, auf der sich der Text der aktuellen Zeile befindet).

Hintergrundtisch

Das Hintergrundbild oder die Farbe kann auch sowohl für die gesamte Tabelle als auch für eine einzelne Zelle gefragt werden, alles hängt davon ab, welchen Toren, die Sie einräumchen. Dies ist eingestellt - für das Bild - Attribut hintergrund.Der Wert, dessen der Pfad in die erforderliche grafische Datei verschrieben wird. Für Farbhintergrund - Attribut bgcolor.Hier ist der Wert der Name der Farbe.

Abschließend

Hier ist im Allgemeinen und alles, was für das Einstiegsniveau erforderlich ist. Am Ende des Abschnitts auf dem Bauen von Tabellen in HTML endet Ihre erste Bekanntschaft mit HTML. Mit der Hilfe tabellen in HTML. Sie können einfache Webseiten-Vorlagen erstellen, sodass ich vorschlage, dass Sie gerade Ihr erstes vollwertiges Full-Lower-Richtige erstellen. Das Material ist dafür ganz genug passiert. Weiter zur Eroberung des Hyperraums!


/ Dann, ohne dass es keine Website erstellt: ∼ ∼

Eine Aufgabe

Erstellen Sie eine Tabelle und geben Sie die Parameter (Felder und Abstand zwischen Zellen) durch Stile an.

Entscheidung

Die Tabelle besteht aus Zeilen und Zellsäulen, die Text und Zeichnungen enthalten können. So fügen Sie eine Tabelle zu einer verwendeten Webseite hinzu

. Dieses Element dient als Container für Elemente, die den Inhalt des Tisches bestimmen. Jede Tabelle besteht aus Zeilen und Zellen, die entsprechend mit Tags angegeben sind und
. Der Tisch muss mindestens eine Zelle enthalten (Beispiel 1). Es ist zulässig anstelle von Tag Verwenden Sie Tag. . Text in der mit Tag dekorierten Zelle Zeigt den Kreditnehmer-Schrift mit fetthaltigen Schlägen an und ist in der Mitte der Zelle ausgerichtet. Ansonsten ist der Unterschied zwischen den Zellen, die über Tags erstellt wurden und Nein.

Beispiel 1. Erstellen einer Tabelle

HTML5 IE CR OP SA FX

Tagtabelle.

Zelle 1. Zelle 2.
Zelle 3. Zelle 4.

Die Reihenfolge ist der Ort der Zellen und ihre Spezies sind in Fig. 4 gezeigt. einer.

Feige. 1. Das Ergebnis der Erstellung einer Tabelle mit vier Zellen

Attribut-Grenz-Tag.

zulässig, nur mit einem leeren Wert hinzuzufügen (
) oder gleich 1. Alle anderen Werte übergeben keine Bestätigung.

Um die Felder in den Zellen zu steuern, verwenden Sie die Stileigenschaftspolsterung, die dem TD-Selektor hinzugefügt wird. Der Abstand zwischen den Zellen wechselt die Grenzabstandseigenschaft (Beispiel 2) wird zum Tischwähler hinzugefügt, der IE-Browser versteht es nur von Version 8.0.

Beispiel 2. Felder innerhalb von Zellen

HTML5 CSS 2.1 IE CR OP OP FX

Tagtabelle.

Titel 1.Titel 2.
Zelle 3.Zelle 4.

Tabelle mit Feldern und Abstand zwischen den Zellen sind in Fig. 4 gezeigt. 2. Ein ähnliches Ergebnis kann mit Hilfe eines weißen Rahmens um die Zellen erreicht werden.

Feige. 2. Felder in Tabellenzellen

Fortsetzung des Themas:
das Internet

Eine der beliebtesten Möglichkeiten, um eine Windows-Bootdiskette zu erstellen, ist die in diesem Artikel beschriebene Methode. Und genauer in der Schöpfung wird es uns mit einer fernen Welt helfen ...