Generator für benutzerdefinierte CSS-Rahmen
Passen Sie Dicke, Stil, Farbe und Rundung eines CSS-Rahmens an — einheitlich oder pro Seite — mit einer Live-Vorschau, und kopieren Sie dann den fertigen Code. 100% lokale Verarbeitung — nichts wird an einen Server gesendet.
So funktioniert es
Ein CSS-Rahmen kombiniert drei Informationen: eine Dicke, einen Linienstil und eine Farbe, gegebenenfalls abgerundet mit border-radius. Dieses Tool lässt Sie diese Werte einheitlich auf allen vier Seiten oder unabhängig für jede Seite anpassen, mit sofortiger visueller Darstellung, um den Effekt vor dem Kopieren des Codes zu prüfen.
Was ist der Unterschied zwischen "groove", "ridge", "inset" und "outset"?
Diese vier Stile simulieren einen 3D-Reliefeffekt anhand der gewählten Farbe: "groove" erweckt den Eindruck einer eingekerbten Rinne, "ridge" einer erhabenen Kante, "inset" eines eingelassenen Rahmens und "outset" eines hervorstehenden Rahmens; die genaue Darstellung hängt vom Browser und der verwendeten Hintergrundfarbe ab.
Warum die Dicke pro Seite trennen, statt die Kurzform "border" zu verwenden?
Die Kurzform border erlaubt es nicht, für jede Seite eine unterschiedliche Dicke festzulegen; für einen asymmetrischen Effekt (dicker Rahmen oben, dünn an den Seiten) müssen die detaillierten Eigenschaften border-top-width, border-right-width usw. verwendet werden, wie es dieses Tool tut, wenn die Option "gleiche Dicke" deaktiviert ist.
Es werden keine Daten an einen Server übertragen: Vorschau und Code werden direkt in Ihrem Browser generiert.