Zum Inhalt springen
ThreadWebdesign

Semitransparenter Hintergrund

Kategorie
Webdesign
Gelesen
2881
Antworten
11
Erstellt von: gelöschter BenutzerDatum: 22.11.2009, 18:37 Uhr
Archiv-KommentarArchiviert, nicht priorisiertWebdesign

Redaktionelle Einordnung

Diese archivierte Diskussion behandelt Semitransparenter Hintergrund aus Sicht der Rubrik Webdesign.

Die Diskussion bleibt als Archiv nutzbar. Für die aktuelle Bewertung empfehlen sich ergänzend neuere Artikel, Tools oder eine konkrete Analyse.

Sinnvoll nutzbar bleibt der Thread vor allem als historischer Kontext, für typische Fragestellungen und zur Einordnung älterer Empfehlungen.

Einige im historischen Thread genannte Tools, Dienste oder externe Links könnten heute nicht mehr verfügbar oder inhaltlich überholt sein. Nutzen Sie sie bitte nur mit zusätzlicher Prüfung.

Startbeitrag

Originaler Foreninhalt in modernisierter Darstellung.

Zur Kategorie
gelöschter Benutzer
Threadstart · Webdesign 2881 mal gelesen · 22.11.2009, 18:37 Uhr

Weiss jemand wie am einen semitransparenten Hintergrund bspw. für boxes mittels css erstellen kann bzw. welche Eigenschaft hier zu wählen ist?

Gruß,
Claudio.

Antworten

10 Beiträge
gelöschter Benutzer
am 22.11.2009, 18:42 Uhr schrieb
Antwort

Passe schrieb:

Weiss jemand wie am einen semitransparenten Hintergrund bspw. für boxes mittels css erstellen kann bzw. welche Eigenschaft hier zu wählen ist?

Gruß,
Claudio.



probier mal das hier :

.trans_box2 {
font-family:verdana;
font-weight:bold;
padding:40px;
margin:30px;
border:solid 1px #555;
/* Mozilla ignores crazy MS image filters, so it will skip the following */
filter:progidXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src=\'/75p_honey.png\');
}
/* IE ignores styles with [attributes], so it will skip the following. */
.trans_box2[class] {
background-image:url(/75p_honey.png);
}

gelöschter Benutzer
am 22.11.2009, 18:56 Uhr schrieb
Antwort

Merci - hab ich mir mal abgespeichert.

Gruß,
Claudio

gelöschter Benutzer
am 22.11.2009, 18:58 Uhr schrieb
Antwort

Passe schrieb:

Weiss jemand wie am einen semitransparenten Hintergrund bspw. für boxes mittels css erstellen kann bzw. welche Eigenschaft hier zu wählen ist?


Du kannst ja auch einfach ein halbtransparentes Hintergrundbild einfügen.

Oder schau mal hier.

gelöschter Benutzer
am 22.11.2009, 19:08 Uhr schrieb
Antwort

Interessanter Link - ist gebookmarked.

Wie erstelle ich bestenfalls ein semitransparentes Bild?

Gruß,
Claudio

gelöschter Benutzer
am 22.11.2009, 19:15 Uhr schrieb
Antwort

Passe schrieb:

Wie erstelle ich bestenfalls ein semitransparentes Bild?


Dazu brauchst du eigentlich nur ein Bildbearbeitungsprogramm mit entsprechenden Fähigkeiten (z.B. Paint.NET).

Ansonsten kannst du mir das Bild schicken und ich mach\'s schnell für dich.

gelöschter Benutzer
am 22.11.2009, 19:27 Uhr schrieb
Antwort

Raptor schrieb:


Ansonsten kannst du mir das Bild schicken und ich mach\'s schnell für dich.



Ja, gerne - an kontakt at floern.com?

Gruß,
Claudio.

gelöschter Benutzer
am 22.11.2009, 19:46 Uhr schrieb
Antwort

Passe schrieb:

Ja, gerne - an kontakt at floern.com?


Ja , diese Mail-Adresse gibt\'s erst seit zwei Stunden, dann kann ich sie gerade mal testen.

gelöschter Benutzer
am 22.11.2009, 20:44 Uhr schrieb
Antwort

Danke für die schnelle Unterstützung - ich habe für die Zukunft mal PAINT.NET installiert.

Gruß,
Claudio

gelöschter Benutzer
am 22.11.2009, 21:42 Uhr schrieb
Antwort

Semitransparente Bilder lassen mir keine Ruhe:

Ich habe jetzt PAINT.NET instaliiert und einiges ausprobiert - komme aber irgendwie nicht wirklich voran - wie hast du das nur so schnell gemacht?

gelöschter Benutzer
am 22.11.2009, 21:54 Uhr schrieb
Antwort

adi schrieb:

probier mal das hier :

.trans_box2 {
...


Es geht inzwischen auch etwas eleganter ohne Bild mit rgb-Angaben für die Farbe (hier rgba mit a für alpha-Transparenz). Geht für aktuelle Browser: Mozilla (Firefox), Opera, Safari, Chrome etc.

#trans_box2 {
background-color: rgba(255, 0, 0, 0.2);
}

Der IE braucht eine extra Regel als conditional comment:

-->



Bei Mozilla und Co funktionieren Werte zwischen 0.0 und 1.0, beim IE zwischen 10 - 100.

Gérard