HTML zuordnet die grundlegende Webseitenstruktur in einer Website zu, und es können verschiedene Arten von Stylen angewendet werden, indem CSS verwendet wird. Es verfügt auch über verschiedene Styling -Eigenschaften, die zum Zeichnen verschiedener Formen verwendet werden, einschließlich Kreise, Quadrate, Rechtecke, Linien, Ovalen und vielen anderen. Darüber hinaus ist eine Linie das am häufigsten verwendete Element, das in jeder Form hinzugefügt werden kann, einschließlich vertikal und horizontal in einem Behälter.

In diesem Beitrag werden speziell die folgenden Methoden erörtert:

• Methode 1: Wie zeichnet man eine Linie in einem DIV mit dem “Grenzboden" Eigentum?
• Methode 2: Wie zeichnet man eine Linie in einem DIV mit der “

  ---

  " Schild?

Methode 1: So zeichnen Sie eine Linie in einem DIV mit dem Grundstück „Grenzboden“?

Um eine Linie in einem DIV zu zeichnen, können Sie die „verwenden“GrenzbodenEigentum, das alle Seiten außer dem Boden des Randes verbirgt.

Um diesen Ansatz anzuwenden, lesen Sie die angegebenen Schritte.

Schritt 1: Erstellen Sie einen DIV -Behälter

Erstellen Sie zunächst einen DIV -Behälter mit Hilfe des “”Tag und einfügen eine“AusweisAttribut mit einem Namen entsprechend Ihrer Wahl.

Schritt 2: Überschrift hinzufügen

Fügen Sie als Nächst

" Zu "

”. Zum Beispiel haben wir das verwendet

”Tag zum Hinzufügen der Stufe 1.

Schritt 3: Erstellen Sie einen weiteren Div -Container

Erstellen Sie nun einen weiteren Div -Container, indem Sie demselben Verfahren folgen:

Zeichne eine Linie

Ausgang

Schritt 4: Stil „Main-Div“ -Container

Greifen Sie mit dem ID -Selektor auf den Div -Container zu. “#"Und der Name der"Ausweis”. Wenden Sie dann die CSS -Eigenschaften für ein weiteres Styling an:

#Main-div
Farbe: RGB (247, 171, 9);
Text-Align: Mitte;
Rand: 50px;

Hier:

• “FarbeDie Eigenschaft wird verwendet, um die Farbe des ausgewählten Elements anzugeben.
• “TextausrichtungDie Eigenschaft übereinstimmt den hinzugefügten Text in "Center”.
• “Rand”Definiert Platz für das Element außerhalb des Elements.

Schritt 5: Style „Line-Div“ -Container

Greifen Sie dann auf den zweiten Div -Container zu und wenden Sie die folgende CSS -Eigenschaft an, um die gewünschte Ausgabe zu erhalten:

.Zeilen-div
Breite: 150px;
Höhe: 50px;
Position: absolut;
Grenzboden: 3px fest rot

Nach dem obigen Code -Snippet:

• Setzen Sie die “BreiteWert zur Zuweisung der Breite des Elementinhaltsbereichs.
• “HöheEigenschaft definiert die Elementgröße vertikal.
• “Position”Gibt die Art der Positionierungsmethode an, die für ein Element verwendet wird
• Zu guter Letzt, "Grenzboden”Definiert die Breite, den Linienstil und die Farbe des unteren Randes einer Box.

Es kann beobachtet werden, dass wir eine Linie am unteren Rand des Divs erfolgreich hinzugefügt haben:

Methode 2: Wie zeichnet man eine Linie in einem DIV mit der “

---

" Schild?

In HTML die “

---

Das Tag steht für eine horizontale Regel, die einen thematischen Pause auf der Seite definiert. Insbesondere kann dieses Tag zum Zeichnen einer Linie in einem DIV verwendet werden, ohne die CSS -Eigenschaften zu verwenden.

Zeichnen Sie eine Linie in einem DIV -Behälter mit dem

---

Tags -Tag, probieren Sie die folgenden Anweisungen aus.

Schritt 1: Erstellen Sie einen Container

Erstellen Sie zunächst einen DIV -Behälter mit Hilfe des “" Schild. Fügen Sie außerdem eine Klasse mit einem Namen in der Öffnung "" hinzu. Fügen Sie dann eine Überschrift hinzu, indem Sie das verwenden "

" Schild.

Schritt 2: Einfügen “

---

”Tag, um eine Linie zu zeichnen

Fügen Sie danach das Absatz -Tag ein “

”Und fügen Sie die" hinzu "

---

”Tag im Inneren der

Schild. Darüber hinaus können Sie auch die Farbe innerhalb des HR -Tags angeben:

Zeichne eine Linie

---

Ausgang

Schritt 3: Wenden Sie CSS -Eigenschaften auf den Container „Line“ an

Dann greifen Sie auf die “zu"Linie”Container mit dem DOT -Selektor und stylen Sie ihn entsprechend:

.Linie
Grenze: 0;
Höhe: 3px;
Rand: 50px;

Hier haben wir das angewendetHöhe","Breite" Und "RandEigenschaften der ausgewählten Div.

Ausgang

Es kann beobachtet werden, dass eine Linie mit dem gezeichnet wurde

---

Tag in HTML.

Abschluss

Um eine Linie in einem DIV zu zeichnen, können HTML -Benutzer entweder die “verwenden“

---

”Tag oder das“untere Grenze”CSS -Eigenschaft. Im ersten Ansatz die CSS -Eigenschaft “untere Grenze”Versteckt alle Seiten des Randes mit Ausnahme des Bodens der Grenze. Für den zweiten Ansatz müssen Sie nur die “angeben“

---

”Tag zum Erstellen einer horizontalen Linie ohne Verwendung von CSS -Eigenschaften. Dieser Beitrag hat gezeigt, wie man eine Linie in einem DIV unter Verwendung von zwei verschiedenen Methoden zeichnet.