Stellen Sie die Tabellenspaltenbreite Konstante unabhängig von der Textmenge in ihren Zellen ein?

Stellen Sie die Tabellenspaltenbreite Konstante unabhängig von der Textmenge in ihren Zellen ein?

Wenn Sie sich mit Tabellen befassen, ist die Festlegung der Breite der Tabellenzelle, die nicht vom Inhalt oder der Textgröße abhängt. Wenn der Text der Tabellenzellen zu lang/lang geworden ist, ändert sich die Breite der Spalte automatisch. Verwenden Sie die Eigenschaft "Tabelle-Layout", um die Spaltenbreite der Tabellenspalten zu beheben, und setzen.

Dieser Beitrag wird demonstrieren:

  • Wie man eine Tabelle in HTML erstellt?
  • So setzen Sie die Tabellenspaltenbreite Konstante unabhängig von der Textlänge?

Wie man eine Tabelle in HTML erstellt?

Um eine Tabelle in HTML zu erstellen, probieren Sie das unten erwähnte Verfahren aus.

Schritt 1: Erstellen Sie eine Tabelle

Erstellen Sie zunächst eine Tabelle mit Hilfe des “

”Tag und fügen Sie die“ ein und “Grenze”Attribut, um den Rand um den Tisch zu setzen.

Schritt 2: Fügen Sie Zeilen und Kopfzelle hinzu

Fügen Sie als nächstes die Tabellenreihen mit dem hinzu “

"Tag und fügen Sie Überschriftenzellen hinzu, indem Sie die" verwenden "" Stichworte:

”. Der Überschriftentext ist dazwischen definiert “" Stichworte:

Schritt 3: Datenzellen hinzufügen

Um die Datenzellen hinzuzufügen, die “

"Etikett wird dazwischen verwendet"





Vorname Familienname, Nachname Adresse
Hafsi Rana Haus Nr. 3 Vereinigtes Königreich
Jenny Mogul Haus Nr. 219 Türkei
Mari Awan Haus Nr. 487 Kanada

Die Tabelle wurde erfolgreich erstellt:

So setzen Sie die Tabellenspaltenbreite Konstante unabhängig von der Textlänge?

Um die Breite der Spalte einzustellen, die unabhängig von der Textmenge konstant ist, befolgen Sie die folgenden Anweisungen.

Schritt 1: Tischlayout einstellen

Greifen Sie zunächst mit Hilfe des Tag -Namens auf die Tabelle in CSS zu. Dann wenden Sie die “an“Tischlayout”Eigenschaft und setzen Sie den Wert"Fest”Um die Breite der Tabellenzellen konstant zu machen.

Schritt 2: Wenden Sie andere CSS -Eigenschaften an

Verwenden Sie zum Styling der Tabelle die folgenden codierten Eigenschaften:

Tisch
Tischlayout: behoben;
Grenze: 2px fester RGB (240, 113, 10);
Breite: 200px;
Rand: Auto;
Hintergrundfarbe: RGB (245, 210, 210);

Hier:

  • Der "Grenze”Ist eine Kurzeigenschaft, mit der Grenze, Grenzstil, Breite und Farbe definiert werden.
  • Als nächstes das "Breite”Wird verwendet, um die Breite des Elements festzulegen.
  • Der "Rand”Bestimmt die Weltraum -Außenseite der definierten Grenze.
  • Dann ist die "HintergrundfarbeEigenschaft, die zum Festlegen der Hintergrundfarbe auf der Rückseite des Elements verwendet wird.

Ausgang

Schritt 3: Setzen Sie die Breite der Tabellenzelle

Greifen Sie auf die Tabellenzellen wie Überschriften und Datenzellen mit “zu“th" Und "td”:

th, td
Grenze: 2PX Solid RGB (14, 156, 250);
Überlauf versteckt;
Breite: 150px;

Hier das "ÜberlaufDie Eigenschaft wird als versteckt eingestellt. Diese Eigenschaft gibt an, was passieren soll, wenn der Inhalt in Tabellenzellen überläuft.

Ausgang

Wir haben die Methode zum Festlegen der Tabellenspaltenbreite des Tabelle demonstriert.

Abschluss

Erstellen Sie zunächst die Tabellenspaltenbreite Konstante, indem Sie die Tabelle verwenden, indem Sie die “verwenden

" Schild. Verwenden Sie dann das “Tischlayout"CSS -Eigenschaft und setzen Sie ihren Wert als" als "Fest”Um die Tischlayoutgröße zu beheben. Wenden Sie danach andere CSS -Eigenschaften an, wie z. "Breite "," Grenze "," Überlauf "und" RandEigenschaften, um den Tisch zu stylen. Dieser Beitrag hat die Methode zum Festlegen der Tabellenspaltenkonstante unabhängig vom Text in seinen Zellen demonstriert.