Blog Hintergrund Transparent

Decilla

Seid gegrüßt:

an welcher Stelle des Stylesheets muss ich den Code wie ändern, um eine Transparenz des Blog Backgrounds, also dort, wo sich der Content befinden, zu erzeugen.

Der Background, dieses Microphonebild soll durchschimmern.

http://ohugstest.oh.funpic.de/wordpress/

Ich hoffe es ist zu verstehen, was ich meine. Viele Dank

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Xone

Hallo,

Style.css Zeile 118

Wenn du die rote zeile entfernst

Code

.main-content {
    [COLOR=#ff0000]background-color: rgb(255, 255, 255);[/COLOR]
    box-shadow: 0px 0px 5px rgb(193, 193, 193);
}

ist alles Transparent, allerdings auch der obere Bereich. Musste dann extra anpassen und die Schriftfarben auch.

Mfg

formateins

Ganz so einfach isses nicht...

Du musst an mehreren Stellen einen transparenten Hintergrund angeben:

Code

[FONT=Consolas]background: rgba(255,255,255,0.2);[/FONT]

bzw.

Code

[FONT=Consolas]background-color: rgba(255,255,255,0.2);[/FONT]

Das betrifft den Inhaltswrapper, den Bereich für die Social Icons oben, den Slider (Achtung, da haben fast alle Elemente eine Hintergrundfarbe gesetzt) und natürlich alle weiteren Dinge.

Hier mal ein Preview: [ATTACH=CONFIG]7826[/ATTACH]

Decilla

Danke!

Zitat von formateins
Ganz so einfach isses nicht...
Du musst an mehreren Stellen einen transparenten Hintergrund angeben:
Code
[FONT=Consolas]background: rgba(255,255,255,0.2);[/FONT]
bzw.
Code
[FONT=Consolas]background-color: rgba(255,255,255,0.2);[/FONT]
Das betrifft den Inhaltswrapper, den Bereich für die Social Icons oben, den Slider (Achtung, da haben fast alle Elemente eine Hintergrundfarbe gesetzt) und natürlich alle weiteren Dinge.
Hier mal ein Preview: [ATTACH=CONFIG]7826[/ATTACH]

Vielen Dank,

ich bin wirklich begeistert - es ist ja tatsächlich so, dass man in vielen Foren gleich "ärger" bekommt, dass man eine dumme Frage stellt. Vielen Dank für das Feedback.

Habe jetzt noch was:

das grau da oben und das grün ganz unten =)

http://ohugstest.oh.funpic.de/wordpress/

hässlich.

angehängte grafik nicht beachten

Decilla

EDIT: Anfängerfrage:

Wie bekomme ich dieses hässliche Grün getauscht?

Einfach im stylsheet den Farbcode austauschen? Ist das echt so einfach?
Gilt das auch für Schrift und Mouseovers, etc.?

Xone

Style.css Zeile 573

Code

.index-info {
    background: url("images/green-sep.png") repeat-x scroll 0% 0% rgb(113, 150, 60);

Das grüne da unten ist ein Bild. Kannste einfach im Theme Ordner bearbeiten und wieder genauso nennen.

Kannst aber auch die Codezeile löschen dann wirds transparent wie der rest deiner seite.

Oder löschst die Zeile und gibst mit background: deine farbe an.

MfG

Decilla

Ihr seid Klasse

Zitat von Xone
Style.css Zeile 573
Code
.index-info {
    background: url("http://forum.wpde.org/images/green-sep.png") repeat-x scroll 0% 0% rgb(113, 150, 60);
Das grüne da unten ist ein Bild. Kannste einfach im Theme Ordner bearbeiten und wieder genauso nennen.
Kannst aber auch die Codezeile löschen dann wirds transparent wie der rest deiner seite.
Oder löschst die Zeile und gibst mit background: deine farbe an.

MfG
Alles anzeigen

Nochmal großes Lob - ihr seid hier echt klasse und hilfsbereit. Besten Dank.

Muss aber nochmal nachharken: Dieses grün findet sich auf Buttons und auf den einzelnen Seiten wieder. Wird das ein Farbcode sein oder sind das Bilder? Und woher wisst ihr immer, wo ihr suchen sollt. =)

Vielen Dank.

Xone

Für Firefox gibts das Addon Firebug (kostenlos). Da kannste mit rechtsklick auf deine Seite klicken. Das Element was geändert werden soll. Dann zeigt dir Firebug den dazugehörigen Code gleich an und du kannst testen welcher code was bewirkt. Ohne was zu zerstören.

Der grüne Read more button bei dir wurde auch mit nem bild versehen.

Style.css Zeile 547 (zeigt firebug auch an)

Code

.bottom-feature-left-inner a.index-read {
    background: url("images/index-read.png") no-repeat scroll 0% 0% transparent;

formateins

Ich weiß nicht, ob es sich schon rumgesprochen hat, aber der Firefox braucht keine Erweiterung mehr. Rechtsklick auf das Element > Element untersuchen (Q) > fertig.

Dito für den Chrome. ;)

Decilla

Vielen Dank

Hallo,

vielen Dank für eure Hilfe und euren Support. Ich werde mich mal weiter in die Materie einlesen. Ist ja nicht ganz ohne.

Aber nochmal danke für die schnellen und bündigen Antworten. Super Forum!!! :idea:

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Blog Hintergrund Transparent

Jetzt mitmachen!