Seiten-Hintergrund transparent

  • Hi,

    ich bin langsam am verzweifeln. Ich habe schon gefühlt alles versucht, leider stehe ich immer noch auf dem Schlauch.

    Was muss ich bei zusätzliches CSS einfügen, damit ich den Hintergrund (also den der Seite, Menü, header, footer) transparenter machen kann, damit man das Bild leicht sehen kann?

    Link zur Seite (noch im Aufbau):

    http://www.mittelamerika-cichliden.de

    Beste Grüße
    Tobi

    • Anzeige

    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

  • Moin Tobi,

    du kannst den Wert für die Hintergrundfarbe als RGB-Farbe mit Alpha-Kanal angeben. Also statt "#000000" das hier "rgba(0, 0, 0, 0.8)".
    Der Wert 0.8 steht für eine Deckkraft von 80%

    LG
    Sven

  • Hi Sven,

    ja das ist mir bewusst, hätte ich vielleicht erwähnen müssen und das Problem genauer erwähnen.

    Ich kann sozusagen nicht auf den „Container“ zugreifen. Wenn ich .site {} nehme, ändert sich quasi nur ein kleiner Container um die Schrift/Inhalt, aber nicht komplett.

    LG
    Tobi

  • Hi Tobi,

    das liegt an der Spezifizität des CSS-Selektors. Auf dem DIV-Element mit der id "content" ist ein Inline-Style gesetzt, der alle anderen Angaben überschreibt, weil er vom Browser als wichtigste Angabe deklariert wird.

    Code
    <div id="content" class="site-content" style="background-color: #000000; color:#ffffff;" role="main">

    Du könntest entweder das Inline-CSS dort entfernen, oder das mit der Regel !important überschreiben (was generell nie die eleganteste Lösung ist). Das sieht dann folgendermaßen aus:

    CSS
    div#content {
        background-color: rgba(0,0,0,0.8) !important;
    }

    LG
    Sven

  • du hast doch schon bei .navigation und bei #content den background #000000 angegeben. Stattdessen halt für die gewünschten Class oder ID das von svenbolz angeben.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • Hi,

    danke! Genau das war das was ich gebraucht habe. Danke Sven!

    Hab mich da zu sehr auf das falsche konzentriert und bin nicht mehr weitergekommen.

    Grüße Tobi

  • Hi
    ich hab ein ähnliches Problem:
    Ich möchte den Hintergrund meiner einzelnen Seite transparent machen, um das Hintergrund-Bild in meinem WP-Theme Lyrical weniger zu verdecken.
    Ich habe dazu schon bei "Zusätzliches CSS" eingetragen:
    div#cookie-notice{background-color: rgba(230,0,0,0.2) !important;} (habe ich in einem anderen Beitrag gelesen)

    Allerdings hab ich keine Ahnung wie ich dass nun konkret anwenden kann, wo ich darauf bei den Einstellungen zurückgreifen kann.
    Kann mir jemand dazu den entscheidenden Tipp geben?

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!