Und es geht doch: Dem Hintergrund eine beliebige Transparenz verpassen während der Text undurchsichtig bleibt (Achtung: Wortwitz!).
Für dieses Beispiel brauchst du keine htc- oder hta-Datei, sondern lediglich ein .gif! Die Kehrseite: Wir müssen den Pfad des W3C verlassen…
Für diese Variante werden zwei Container benötigt. Aus semantischer Sicht würde ich einen p-Tag für den textlichen Inhalt wählen und einen div-Container für die Einbettung des Hintergrunds.
Der div-Container beeinhaltet den gewünschten “background” und wird transparent eingestellt. Dafür verwendet man drei verschiedene Angaben, um die verschiedenen Browser anzusprechen (-moz-opacity: Mozilla, filter:alpha: Opera und andere, opacity: IE). Die Werte kann man sich als Pendant zu Prozentwerten vorstellen, wobei 100 bzw. 1 dem Wert 100% entspricht. Achtung! Diese Eigenschaften gehören nicht zum offiziellen W3C-Standard!
Zweiterer ist für den eigentlichen “Inhalt” (z.B. Text) verantwortlich und wird über den ersten gelegt. Das ist notwendig, damit der “Inhalt” des Containers von der Durchsichtigkeit unberührt bleibt.
Die Art des Containers (p, div) ist nicht ausschlaggebend für das Ergebnis und auch die Art des übereinanderlegens (position: absolute, margin-top: -x, o.ä.) kann beliebig gewählt werden.
So sieht das dann aus:
Die U.S. Bombs sind eine Punk-Band aus Orange County, Kalifornien (USA). Gegründet wurde die Band von Skater-Legende Duane Peters und Shattered Faith Gitarristen Kerry Martinez. Bekannt wurden sie als Punkrock Band mit starken 77er Punk einfüssen. Während sich das Line-Up um Peters und Martinez stets veränderte, veränderte sich ihr Musikstil kaum.
Quelle: last.fm
No. 1
40% opacity
Und hier ist der Code:
<div style="width:200px; height:200px; filter:alpha(opacity=40); -moz-opacity:.40;opacity:.40; background:url(http://www.freizeitler.de/pics/bombs.gif) no-repeat"> </div>
<p style="width:290px; text-align:center; position:relative; margin-top:-100px; top: -50px; color:black; font-size: 30px"> No. 1<br>40% opacity</p>
BigBert
(am 07. September 2008 um 12:17)klasse hilfe! hat alles bestens funktioniert und mir echt geholfen!
danke!!!