zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Bild mit Rahmen aus Bild

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 17.05.2008, 21:04
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 09.11.2004
Beiträge: 343
Holger (HMR) befindet sich auf einem aufstrebenden Ast
Standard Bild mit Rahmen aus Bild

Hallo Zusammen,

ich würde gerne einer Reihe von Bildern automatisch einen Rahmen verpassen,
der sich aus einem Bild erstellt.
Das Bild selber ist eigentlich ein Bild das einen Rahmen darstellt. siehe Anlage.
jetzt habe ich schon einige Lösungen:
1 - Tabellen, ist klar, aber keine Lösung.
2 - Container um das bild legen
3 - Container ineinander verschachteln mit backgroundimages
2. und 3 scheint mir aber sehr aufwendig im html-quelltext.

jetzt habe ich mir gedacht, ich kenn ja die Größe des Image,
und die notwendige breite des Rahmens.

nun habe ich zwei Ideen:
A.
wenn ich das Image jetzt in einen Container packe, dem die breite und höhe des Images zuzüglich die Stärke des Rahmens verpasse, und dem Container nun dies als breite und höhe gebe und den rahmen als backgroundimage,
dann habe ich jetzt nur noch das Problem, das ich die Wiedergabe des vorhandenen Backgroundbildes auf diese Größe einstellen muss.
dazu konnte ich nichts finden. geht das???

optional könnte ich natürlich per php das Rahmenimage neu definieren,
das raubt aber zu viel Ressourcen, dann kann ich das darzustellende Bild gleich mit einem Rahmen versehen.

B.
Ich verpasse dem Image selber ein padding und ein Hintergrundbild,
hab dann aber wieder das Problem, das ich das Hintergrundbild resizen muß.

gibt es eine Möglichkeit sowas zu gestalten:
Code:
 background-image: URL('../images/rahmen.png width:80PX;heigth:170 px;');
oder kennt jemand eine Möglichkeit einem Border-Anweisung ein image zu verpassen? ich meinte, ich hab das mal irgendwo gesehen, kann es aber nciht wieder finden.

Hat da wer eine Idee zu???
Vielen Dank schon mal für das lesen.
Angehängte Grafiken
Dateityp: png rahmen.png (7,0 KB, 25x aufgerufen)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 17.05.2008, 21:50
Benutzerbild von Timo
table-layout: none;
XHTMLforum-Kenner
 
Registriert seit: 11.11.2006
Beiträge: 5.345
Timo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein Lichtblick
Standard

Code:
img.rahmen {
     background-image: url('../images/rahmen.png');
     background-repeat: no-repeat;
     padding: 10px 15px;
}
Code:
<img src="bild.png" class="rahmen" alt="bild mit rahmen">
Du musst halt das Padding anpassen. 1. Wert = Oben / Unten 2. Wert = Rechts / Links
__________________
Um weitere Erklärungen eingeblendet zu bekommen, drücken Sie bitte die Tastenkombination Alt + F4
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 21.05.2008, 13:45
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 09.11.2004
Beiträge: 343
Holger (HMR) befindet sich auf einem aufstrebenden Ast
Standard

Hallo Timo,

danke für den code.
Das würde so gehen, wenn alle Bilder gleich groß sind,
sind sie aber nicht. Auch das Seitenverhältnis ist nicht immer gleich.

Das backgroundimage wird immer in seiner original größe angezeigt.
das muß also resized werden.

Code:
 background-image: URL('../images/rahmen.png width:80PX;heigth:170 px;');
Mit Zitat antworten
  #4 (permalink)  
Alt 21.05.2008, 13:55
Benutzerbild von Timo
table-layout: none;
XHTMLforum-Kenner
 
Registriert seit: 11.11.2006
Beiträge: 5.345
Timo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein LichtblickTimo ist ein Lichtblick
Standard

ein Hintergrundbild kann man in der größe nicht verändern!

Wenn das aber so ist, brauchst du zusätzlich ein paar Divs um das Bild

Der Code von dir ist nicht valide!
__________________
Um weitere Erklärungen eingeblendet zu bekommen, drücken Sie bitte die Tastenkombination Alt + F4
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
IE7- & IE6-Probleme bei Bild und Rahmen... Ragnaroek CSS 2 21.04.2008 16:02
Verflixter Rahmen um ein Bild Webelix CSS 6 22.07.2007 13:32
Rahmen mit Abstand um ein Bild butterhead CSS 11 07.12.2005 18:48
Rahmen um ein Bild (jpg, png, gif) ziehen Don Stefano CSS 8 30.07.2005 22:42
Bild im Rahmen eines div grml CSS 2 12.05.2005 02:20


Alle Zeitangaben in WEZ +2. Es ist jetzt 09:46 Uhr.