✔ Rahmen aus Bildern per CSS-Klasse

[kuhlmaehn]

Hi, irgendwie stehe ich auf dem Schlauch aber ich hab nichts dazu gefunden.
Und zwar würde ich gerne, dass man einem div eine Klasse verpassen kann und dieser dann dadurch einen Rahmen erhält. Dieser soll flexibel sein und dafür aus 4 Ecken und dann beliebig wiederholbaren Stücken bzw. Bildern bestehen. Sowas habe ich normalerweise immer mit 8 divs gemacht und jedem ein Hintergrundbild verpasst. Das finde ich aber irgendwie zu umständliche und unschön im Code.
Jetzt hab ich gelesen, dass CSS3 mehrere Hintergrundbilder erlaubt. Das wäre damit dann ja einfach möglich. Da das aber soweit ich weiß noch nicht draußen ist muss das doch auch anders gehen oder nicht?
Also kurz zusammengefasst: Ich will einem div mit dem Zuweisen einer Klasse einen Rahmen verpassen, der aus Bildern besteht und flexibel ist.
Danke!

 

[hela]

Hi, irgendwie stehe ich auf dem Schlauch aber ich hab nichts dazu gefunden ...

Merkwürdig, wo hast gesucht?
Zum Beispiel findest du hier ein Tutorial, das man dafür verwenden kann. Du musst nur deine Grafik (also die Rahmen) dementsprechend gestalten und dann sieht das so aus wie im Anhang.
Mit einer Klasse und einem DIV-Block kommst du eh nicht hin.

 

[kuhlmaehn]

Hab ich doch geschrieben, dass ich es so normalerweise gemacht hab wie in deinem Link.
Aber dann schließ ich mal aus deinem "Mit einer Klasse und einem DIV-Block kommst du eh nicht hin" das es tatsächlich nicht oder erst mit CSS3 möglich ist. Danke!

 

[Biergamasda]

Ich denke das ist genau das, was du suchst?

http://www.webmasterpro.de/design/a...afik.html#goto-svg-vektorgrafiken-in-xml-form

lg

//edit
hab vergessen dazuzusagen dass der IE damit leichte Probleme hat

 

[kuhlmaehn]

Mh ich hab es mir gerade mal etwas durchgelesen aber wie kann denn eine Vektorgrafik dafür sorgen, dass ein einzelner div durch das Zuweisen einer Klasse ein Rahmen aus Bildern bekommt?
Also eigentlich will ich halt, dass ich einem div eine Klasse zuweise, also

<div class="rahmen"></div>

und dieser hat dann einen skalierbaren Rahmen aus Bildern wie in helas Link.

 

[Biergamasda]

Wenn ich dich richtig verstehe willst du einfach einen skalierbaren Rahmen über ein Bild legen.

Dazu würden mir zwei Methoden einfallen
1. Ein div welches als background-image bzw. als Inhalt das SVG Rahmen Bild hat und in diesem div ein weiteres welches den Inhalt, also das Bild beinhaltet (die Rahmendicke müsstest du dann halt berechnen und dynamisch setzen, bzw. mit % arbeiten)

2. Ein div welches als background-image das Bild enthält und der Inhalt des divs müsste dann dein Bild mit dem Rahmen sein, sozusagen als overlay

Ich persönlich bevorzuge die 1. Variante, da du damit keine Bereiche der Bilder wegwirfst

lg

 

[kuhlmaehn]

Mh sorry das versteh ich nicht
Ich wollt halt einfach ein Rahmen um ein div haben so wie z.B. hier im Forum der Rahmen um den Text. Aber ich hab jetzt rausgekriegt, dass für horizontale und vertikale skalierbare Rahmen 4 divs minimum sind und das in CSS3 dann tatsächlich die Möglichkeit besteht die Border-Eigenschaft mit eigenen Bildern zu bestücken!
Danke!