StyleSheet 09.07.2018, 11:31 Uhr

CSS: Den Rahmen mit einem Bild zeichnen

Über das Tag border-image lässt sich der Rahmen auch mit einem Bild verzieren.
Über color, width und style lässt sich ein Rahmen definieren. Selbst abgerundete Ecken unterstützt CSS. Mithilfe von border-image kann man den Rahmen sogar mit einem Bild zeichnen. Das erklärt Tatjana B. in einem Blogpost.
Mit dem folgenden Code
.box {
border-image:
url(‘images/border.png’) /* source */
27 / /* slice */
12px 5px 15px 20px / /* width */
5px 12px 17px 22px /* outset */
round /* repeat */
}
wird eine Box mit einem Rahmen definiert, der aus dem Bild border.png besteht. Das Resultat kann dann – je nach border.png – beispielsweise so aussehen, wie das Bild zur News.


Das könnte Sie auch interessieren