Antworten auf deine Fragen:
Neues Thema erstellen

Div Hintergrund transparent?

redbull4711

Aktives Mitglied

Hallo @ all,

ich habe eine Frage zum Hintergrund in einem Div. Wenn ich diesen (hier schwarz) transparent erscheinen lassen möchte, kann ich das über css bewerkstelligen? Oder geht es wirklich nur über eine gif/png Grafik. Über dem transparenten Hintergrund soll in dem Div Text stehen, der natürlich nicht transparent ist.

Schein einmal vielen Dank

Grüße
 

redbull4711

Aktives Mitglied

AW: Div Hintergrund transparent?

Dank schon einmal,

leider war das nicht so ganz meine Frage. Habe mich vielleicht falsch ausgedrückt:

Ich erstelle ein Div mit schwarzer Hintergrundfarbe. Gibt es nun einen css Befehl, der dieses Div dann transparent erscheinen lässt. Allerdings lediglich den Hintergrund und nicht den Text, den ich in den / das Div schreibe.

Oder kann ich diese Transparenz lediglich mittels einer Grafik (gif/png) erzeugen?

Grüße
 

agielen

Aktives Mitglied

AW: Div Hintergrund transparent?

css ist zwar für das Layout zuständig, um es schöner zu machen, aber es kann nicht von sich aus eine transparenz erzeugen. Man kann opticity einfügen, aber davon würde ich abraten, weil jeder browser darauf anders reagiert. Außerdem könnte das dann irgendwann in der Ausgabe abgeändert werden, wenn css3 offizeill wird. Schau am besten mal hier rein: opticity
 

redbull4711

Aktives Mitglied

AW: Div Hintergrund transparent?

Jau, genau das habe ich gesucht. Aber wie so oft, mal wieder nicht von allen Browsern unterstützt :'(

Danke Dir.
 

Gackoo_duz

Gackoo

AW: Div Hintergrund transparent?

erstelle ein 1px x 1px grosses gif oder png mit der gewünschten Transparenz und bette es als Hintergrund ein
zu sehen bei:
rechts und links die Ränder sind so entstanden
 
D

dreiphasenreiniger

Guest

AW: Div Hintergrund transparent?

Hallo redbull!

background: black;filter:alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;

In diesem Fall wäre das eine Transparent von 80%.

Allerdings hat dann auch alles in diesem Container eine Transparenz(Schrift, eingebettete Grafiken).
 
G

Guschel

Guest

du kannst auch wenn du im Div noch Text anzeigen willst der aber nicht Transparent sein soll Rgba verwenden. Rgba ist aber Css3.
Code:
background-color: rgba(255,255,255,0.8);

Zur Vervollständigung
/CSS3 im Detail: RGBa ? Norman's Blog
 
Zuletzt bearbeitet von einem Moderator:

redbull4711

Aktives Mitglied

AW: Div Hintergrund transparent?

Moin:)

erstelle ein 1px x 1px grosses gif oder png mit der gewünschten Transparenz und bette es als Hintergrund ein
zu sehen bei:
rechts und links die Ränder sind so entstanden

Ich denke, dass ich es auch so dann umsetzen werde.

Warum gibst du dem div überhaupt 'ne Hintergrundfarbe?

https://developer.mozilla.org/de/CSS/opacity

Allerdings hat das immer auch einfluss auf den Text

Es geht darum dass ich über einem Bild den Contentbereich legen möchte. Damit der Text nicht auf dem Bild verloren geht und alles unübersichtlich wird, möchte ich den Bereich optisch abheben. Das soll eben mit einem Transparenten Bereich geschehen.

Hallo redbull!

background: black;filter:alpha(opacity=80);-moz-opacity: 0.8;opacity: 0.8;

In diesem Fall wäre das eine Transparent von 80%.

Allerdings hat dann auch alles in diesem Container eine Transparenz(Schrift, eingebettete Grafiken).

Das können aber nur sehr wenige Browser anzeige, oder? Daher ist diese Lösung leider nicht so gut für mich.

du kannst auch wenn du im Div noch Text anzeigen willst der aber nicht Transparent sein soll Rgba verwenden. Rgba ist aber Css3.
Code:
background-color: rgba(255,255,255,0.8);

Ich denke, ich werde mit dem 1px x 1px gif arbeiten.

Vielen Dank Euch allen.

Grüße
 
D

dreiphasenreiniger

Guest

AW: Div Hintergrund transparent?

@redbull
Alle IE ab 6
Firefox
Mozilla
SeaMonkey
Safari
Opera

Reicht Dir das?
Und ein .gif funktioniert nicht, nur ein .png
Ein transparentes .png zeigt IE6 nicht an.
 
Zuletzt bearbeitet von einem Moderator:
G

Guschel

Guest

AW: Div Hintergrund transparent?

auf was bezieht sich des jetzt? und warum kann der IE6 keine gifs anzeigen?
 
D

dreiphasenreiniger

Guest

AW: Div Hintergrund transparent?

Der IE 6 kann keine transparenten .png darstellen.
Und ein .gif mit Farbtransparenz funktioniert m.M. nach gar nicht.
Probier es halt mal.;)

Achso meine Antwort bezieht sich auf das Zitat von redbull4711.

Das können aber nur sehr wenige Browser anzeige, oder? Daher ist diese leider nicht so gut für mich.
 
Zuletzt bearbeitet von einem Moderator:

Herr_D

offline

AW: Div Hintergrund transparent?

Nur mal so 'ne Frage nebenbei: Lest ihr auch die Sachen, die gepostet werden?


Wenn ja, dann verstehe ich die Posts nicht. Wenn nein: Fangt an...


Aus meinem gesposteten Link:

Code als auch Browsertauglichkeit:



...und nein es geht nicht darum, dass ich die Antwort gepostet habe, sondern darum, dass auch nicht alles 100x gepostet werden muss...



@redbull

Wahrscheinlich mußt du div in div arbeiten... oder die .gif-Variante...


Ich bin noch in der Schule, falls ich heute abend zu Hause noch dazu komme, versuche ich mal was zu basteln...
 
D

dreiphasenreiniger

Guest

AW: Div Hintergrund transparent?

Ich überfliege die Antworten nur, da wo Links sind, klicke ich nicht drauf.
Da habe ich keine Zeit für.
Ich klicke auf Links nur, wenn ich die Frage selber stelle, dann will ich ja auch zwangsläufig jede Info.
Sorry Kumpel, dass ich Dich übersehen habe. Sind eben schnelle Zeiten.
 

Herr_D

offline

AW: Div Hintergrund transparent?

Ich überfliege die Antworten nur, da wo Links sind, klicke ich nicht drauf.
Da habe ich keine Zeit für.
Ich klicke auf Links nur, wenn ich die Frage selber stelle, dann will ich ja auch zwangsläufig jede Info.
Sorry Kumpel, dass ich Dich übersehen habe. Sind eben schnelle Zeiten.

Ganz großes Tennis...genau so einen haben wir hier noch gebraucht... damit qualifizierst du einen Großteil deiner Beiträge für unseren VIP-Bereich
 
D

dreiphasenreiniger

Guest

AW: Div Hintergrund transparent?

@Herr_D
Wahrscheinlich mußt du div in div arbeiten... oder die .gif-Variante...
Empfehle mir bitte mal ein Tutorial, bei dem ich Alphatransparenz in einem .gif erstellen kann und dieses .gif als transparenten Background in einem Container benutzen kann.

Ich kenne nur eine .png Variante oder die Möglichkeit über CSS.
 

sokie

Mod | Web

AW: Div Hintergrund transparent?

mich würde sehr interessieren, wie das Ergebnis aussehen soll.
Die Sache it dem 1x1 gif kann man ganz und gar vergessen, weil gif keine alpha-transparenz darstellen kann,sondern nur eine Farbe als transparent definieren, das heisst diese ist entweder 100% opak oder 100% transparent (zwischenwerte gibts nicht).
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.614
Beiträge
1.538.351
Mitglieder
67.525
Neuestes Mitglied
mgtaucher
Oben