# Hintergrund halbtransparent **URL:** \ **Category:** Shopware 3.5\ **Tags:** themes--design\ **Created:** [26. August 2014 um 07:33 UTC](https://forum.shopware.com/t/hintergrund-halbtransparent/22076 "2014-08-26T07:33:08Z")\ **Posts on this page:** 6\ **Page:** 1
**Author:** ![Johannes\_R](https://avatars.discourse-cdn.com/v4/letter/j/5daacb/32.png) [@Johannes\_R](https://forum.shopware.com/u/Johannes_R)\ **Post date:** [26. August 2014 um 07:33 UTC](https://forum.shopware.com/t/hintergrund-halbtransparent/22076/1 "2014-08-26T07:33:08Z")
Hallo, habe versucht im (emotion\_black)Standardtheme den Hintergrund halb transparent zu machen. Habe dafür eine halbtransparente PNG erstellt. Wenn ich den Hexcode ändere geht das Problemlos. Wenn ich aber die Farbe in Backround-image wechsel, zeigt es mir weiterhin weiß an. Bin leider nicht der CSS Profi. Ich möchte gerne ein Hintergrundbild einfügen und der Shop halbtransparent drüber liegen lassen. Vielleicht kann mir jemand helfen 🙂 Danke schon mal im voraus. `/\* GENERAL ------------------------ \*/ html, a, a:link, a:active, a:hover, a:visted {color: #333;} html {font: 12px/1.3em Arial,"Helvetica Neue",Helvetica,sans-serif; padding-top: 0px;} .container\_20 {background: url("../images/bgtrans.png") repeat; border-color: #fff;margin-top: 0;} h2, h3 {color:#000} h2 {color: #999;} h2 {margin: 10px 0 20px;} div.ico\_new, div.ico\_tipp, div.ico\_esd {color: #fff;} input.text {background: #fff; border-color: #bbb;} div#article\_details p.red {color:#264409} ` ---
**Author:** ![WBRIAD](https://avatars.discourse-cdn.com/v4/letter/w/5daacb/32.png) [@WBRIAD](https://forum.shopware.com/u/WBRIAD)\ **Post date:** [26. August 2014 um 12:00 UTC](https://forum.shopware.com/t/hintergrund-halbtransparent/22076/2 "2014-08-26T12:00:00Z")
Was meinst du mit [quote]Wenn ich aber die Farbe in Backround-image wechsel[/quote] ---
**Author:** ![Creatixx](https://avatars.discourse-cdn.com/v4/letter/c/c67d28/32.png) [@Creatixx](https://forum.shopware.com/u/Creatixx)\ **Post date:** [26. August 2014 um 12:12 UTC](https://forum.shopware.com/t/hintergrund-halbtransparent/22076/3 "2014-08-26T12:12:54Z")
Eigentlich brauchst du dafür kein halbtransparentes .png Du kannst das auch inn CSS mit `opacity: 0.5; ` erreichen ---
**Author:** ![Johannes\_R](https://avatars.discourse-cdn.com/v4/letter/j/5daacb/32.png) [@Johannes\_R](https://forum.shopware.com/u/Johannes_R)\ **Post date:** [26. August 2014 um 12:31 UTC](https://forum.shopware.com/t/hintergrund-halbtransparent/22076/4 "2014-08-26T12:31:01Z")
[quote=„WBRIAD“]Was meinst du mit [quote]Wenn ich aber die Farbe in Backround-image wechsel[/quote][/quote] Ich habe habe `{background-color: #fff;` in `{background: url("../images/bgtrans.png") repeat;` geändert. Aber mit keinem Erfolg [quote=„Creatixx“]Eigentlich brauchst du dafür kein halbtransparentes .png Du kannst das auch inn CSS mit `opacity: 0.5; ` erreichen[/quote] Dann wird leider alles Transparent. Auch die Schriften in dem Bereich. ---
**Author:** ![WBRIAD](https://avatars.discourse-cdn.com/v4/letter/w/5daacb/32.png) [@WBRIAD](https://forum.shopware.com/u/WBRIAD)\ **Post date:** [26. August 2014 um 15:34 UTC](https://forum.shopware.com/t/hintergrund-halbtransparent/22076/5 "2014-08-26T15:34:43Z")
[quote=“joro89”]Dann wird leider alles Transparent. Auch die Schriften in dem Bereich.[/quote] Das ist klar. Wenn du einem Element (zum Beispiel ein DIV) eine Opacity / Deckkraft von 0.5 zuweißt, werden auch alle darin liegenden Elemente durchsichtig. Du kannst das nur über das transparente PNG lösen. In deinem Fall: `background-color: none; background-image: url('');` Zuerst die Hintergrundfarbe laden, dann das PNG-Bild. Häng’ doch mal ein Bild an, wie’s aktuell aussieht und wohin die Reise gehen soll?! ---
**Author:** ![Neox](https://avatars.discourse-cdn.com/v4/letter/n/b5a626/32.png) [@Neox](https://forum.shopware.com/u/Neox)\ **Post date:** [27. August 2014 um 08:15 UTC](https://forum.shopware.com/t/hintergrund-halbtransparent/22076/6 "2014-08-27T08:15:41Z")
Hallo, lässt sich auch anders lösen. Wenn es ein Bild ist kannst du das nur via einer .png machen. Per CSS lässt sich das ganze auch machen: `background: url('link zum Bild') repeate rgba(255,255,255,0.5)` Ist weiß mit 50% Deckkraft. bei rgba sind die ersten 3 zahlen die Farbzuweißungen (RGB) die letzte ist die Deckkraft/Opacity. Diese kannst du von 0.01 bis 1 eingeben. Vorsicht: Per CSS kannst du das nur machen, wenn es eine Farbe ist. Am Bild selbst verändert das nichts, dafür müsstest du “opacity: 0.5” verwenden, was im html-Tag nicht Sinnvoll ist. Grüße