Wie mache ich einen Rahmen um Bilder im XSL-Stylesheet?

[Luther]

Hallo, sorry für die wahrscheinlich dumme Frage, bin ein Anfänger:

Ich habe ein Programm zum Erstellen von HTML-Fotogalerien, das mit XSL-Stylesheets arbeitet. Um mit die Fotogalerien so hinzubiegen, wie ich es will, ändere ich hier und da ein paar Dinge in den Stylesheets. Jetzt möchte ich einen Rahmen um die Bilder in meiner Galerie haben, bekomme es aber nicht hin.

Im Stylesheet sieht der Bild einfügen-Befehl so aus:

<tr>
<td>
<img>
<xsl:attribute name="src"><xsl:value-of select="Project/Content/Photo/Image"/></xsl:attribute>
</img>
</td>
</tr>

Im HTML-Dokument sieht es dann so aus:

<tr>
<td><img src="xyz.jpg"></td>
</tr>

Ein Rahmen im HTML-Dokument geht ganz einfach:

<tr>
<td><img src="xyz.jpg" border=1></td>
</tr>

Doch wie geht das im XSL-Stylesheet?

Ich habe schon einiges versucht, aber es gibt entweder eine Fehlermeldung oder keinen Rahmen.

 

[Inspector]

Hi,

zwei Wege:

1. Du fügst neben dem Attribut "src" auch noch das Attribut "border" hinzu
2. Du fügst ein Attribut namens "style" hinzu mit dem entsprechenden style als Wert

also möglicherweise (Methode 1) so:

 <img>
<xsl:attribute name="src"><xsl:value-of select="Project/Content/Photo/Image"/></xsl:attribute>
<xsl:attribute name="border">1</xsl:attribute>
</img>

 

[Luther]

Danke für die Hilfe, klappt wunderbar!
Sieht denkbar einfach aus, aber wenn man noch nicht mal HTML kann, ist es schon schwer.
Allerdings war ich bei meinen Versuchen schon nah dran, wie ich jetzt weiss.

 

[Inspector]

Hi,

ich bin auch gerade dran, xsl zu lernen

Vielleicht noch eine Möglichkeit mit mehr Optionen und weniger Schreibarbeit:

Du fügst statt dem Attribut border das Attribut class hinzu mit einem selbst definierten Inhalt. Die genaue Art des Ramens kannst Du dann in einem entsprechenden css stylesheet ausformulieren. Das ist flexibler als einfach border="1". Dort kannst Du demnächst dann auch graphisch aufwändige Ramen drumrumbasteln mit CSS3 border-image.

Ebenfalls ganz nett sind Hintergrundgrafiken hinter den Bildern, die rundum etwas über das Bild hinausschauen. Das erreichst Du ebenfalls im css, einmal per background-image, und einmal mit padding (damit das Hintergrundbild rundum herausschaut). Kann man auch ganz gut mit normalen Ramen kombinieren.