Ein Rahmen in Ihren HTML-Seiten kann dazu beitragen, die Aufmerksamkeit auf einen Textabschnitt zu lenken oder ein anderes HTML-Element zu umgeben.
Wie unten zu sehen ist, kann mit HTML und CSS auf Ihrer Webseite ein Rahmen um jeden Text erstellt werden. Im folgenden Beispiel haben wir einen Absatz (<p> </ p>) mit einem roten Rand umgeben.
Erstes Beispiel mit Text, der von einem roten Rand umgeben ist. Dieses Beispiel hat auch mehrere Zeilen.
Um das obige Beispiel zu erstellen, wurde der folgende Code verwendet.
<p style = "border: 3px; border-style: solid; border-color: # FF0000; padding: 1em;"> Erstes Beispiel mit Text, der von einem roten Rand umgeben ist. <br> Dieses Beispiel hat auch mehrere Zeilen. </ p>
Im obigen Code definiert der Stil die Rahmengröße (px kurz für Pixel), den Stiltyp und die Rahmenfarbe. Der Stil des Rahmens gibt an, wie der Rahmen auf dem Bildschirm angezeigt wird. Andere Arten von Randstilen sind gepunktet, gestrichelt, doppelt, Nut, Grat, Einschub und Anfang. Die Rahmenfarbe definiert die Farbe, die Sie für den Rahmen verwenden möchten. Im obigen Beispiel wurde der Farbcode # FF0000 verwendet, der der Farbcode für Rot ist.
Stil mit CSS definieren
Das Erscheinungsbild von Elementen auf einer Webseite kann auch mit Inline-CSS definiert werden. Inline-CSS wird in Ihrem HTML-Dokument im Element <head> </ head> definiert. Sie können das CSS auch in einer externen Datei mit der Erweiterung .css definieren. Anschließend können Sie von jedem HTML-Dokument aus auf diese Datei verlinken, und Elemente in diesem Dokument haben Zugriff auf die CSS-Stile. Mit dem folgenden CSS-Code wird beispielsweise eine neue Klasse namens "borderexample" erstellt, die auf jedes andere HTML-Tag angewendet werden kann.
<style> .borderexample {border-style: solid; Randfarbe: # 287EC7; } </ style>
Wenn Sie mit dem obigen Code diesen Rahmenstil auf einen HTML-Absatz anwenden möchten, können Sie etwas Ähnliches wie im folgenden Beispiel eingeben.
<p class = "borderexample"> Hier ist ein Beispiel für einen mit CSS erstellten Rahmen </ p>