Rahmen um Bilder oder Texte schmücken die Seite und bringen Abwechslung in die Gestaltung. Wenn Sie Tabellen zum Erstellen von Rahmen verwenden, nimmt der Code für jeden Rahmen zu viel Platz ein. Außerdem müssen Sie in diesem Fall den HTML-Code für jeden Frame neu schreiben. Mit CSS können Sie ganz einfach einen Rahmen mit beliebiger Dicke und Farbe erstellen, indem Sie einmal einen einfachen Code für alle Elemente schreiben, die von diesem Rahmen umgeben werden. Diese Technologie ermöglicht es, bei Bedarf die Art der Frames auf der Website in wenigen Minuten zu ändern.
Es ist notwendig
- - eine eigene Website haben;
- - wissen, was CSS ist und wo diese Stile auf der Website geschrieben sind.
Anleitung
Schritt 1
Um einen Rahmen zu erstellen, schreiben Sie zuerst den folgenden Code in CSS:
ramka {}
Schritt 2
Um den Rahmen auf die gewünschte Größe einzustellen, verwenden Sie den Parameter border-width, der die Linienbreite in Pixel festlegt. Soll die Rahmenlinie beispielsweise 3 Pixel breit sein, dann sieht der Eintrag so aus:
Ramka {Randbreite: 3px;}
Schritt 3
Definieren Sie nun den Stil des Rahmens mit dem Parameter border-style. Wenn Sie einen Rahmen erstellen möchten, dessen Seiten regelmäßige durchgezogene Linien sind, dann fügen Sie den folgenden Eintrag im Code zwischen die geschweiften Klammern - border-style: solid.
Schritt 4
Eine gepunktete Umrandung erhält man, indem man sie wie folgt schreibt: border-style: gepunktet. Checking border-style: dashed gibt Ihnen einen gestrichelten Rahmen.
Schritt 5
Sie können den Rahmen wie folgt zu einer doppelten durchgezogenen Linie machen: border-style: double. Verwenden Sie border-style: groove oder border-style: ridge, um Text oder Bilder in Rahmen mit 3D-Nebeneffekten einzurahmen. Der Unterschied zwischen diesen beiden Optionen besteht darin, dass der Rahmen im ersten Fall aus eingerückten Linien und im zweiten aus konvexen Linien besteht.
Schritt 6
Verwenden Sie diesen Code: border-style: inset, um den Effekt einer Einfügung mit dem Rahmen eines Site-Elements zu erzeugen. Um den Inhalt des Rahmens zusammen mit dem Rahmen konvex zu machen, schreiben Sie border-style: Anfang.
Schritt 7
Sie können dem Rahmen die gewünschte Farbe mit dem Parameter border-color hinzufügen, der ebenfalls zwischen den geschweiften Klammern platziert wird. Wenn Sie den Rand rot machen möchten, schreiben Sie border-color: rot, blau - border-color: blau, orange - border-color: orange.
Schritt 8
Der CSS-Rahmencode, einschließlich aller Optionen, sieht so aus:
Ramka {Randbreite: 3px; Bordüre-Stil: solide; Rahmenfarbe: blau;}
Schritt 9
Schreiben Sie nun in HTML Folgendes:
Rahmeninhalt Anstelle des Wortes "Rahmeninhalt" fügen Sie den Text oder Code des gewünschten Bildes ein.
Schritt 10
Somit können Sie eine unbegrenzte Anzahl von Elementen auf der Site gestalten. Um das Aussehen des Rahmens zu ändern, müssen Sie nur den CSS-Code ändern.
