Transparenz des PNG wird nicht erkannt

  • Hallo,

    ich möchte im Hintergrund einer Column mit einem gekachelten PNG versehen, das teilweise Transparent ist. Leider wird die Tranparenz nicht erkannt und statt dessen an dieser Stelle ein grauer Farbton ausgegeben. Kennt jemand dieses Problem und weiß, ob es sich lösen lässt?

    Viele Grüße
    Scoon

    • 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

  • Hi,

    ich möchte im Hintergrund einer Column mit einem gekachelten PNG versehen, das teilweise Transparent ist.


    Das könnte verschiedene Ursachen haben.

    Einerseits eventuell das Grafikprogramm, dass die transparenten Teile entsprechend mit dem Grauton ersetzt, oder der Browser gibt das so wieder.

    Hast du mal versucht, anstelle vom png Format das alte gif Format zu nehmen, ob dort das Problem dann auch ist?

    Ansonsten ist wie immer auch ein Link zum Problem recht hilfreich. ;)

    Bitte keine Fragen per PM, oder Foren-Chat. Für Fragen ist das öffentliche Forum da. Meine Uerdinger Seite

  • Du gibst dem Element, dem Du den Hintergrund zugewiesen hast, auch eine Farbe. Die sieht man durch die Transparenz natürlich als erstes. Wenn man die weglässt finde ich aber den Text unleserlich (weiß auf fast-weiß).

  • @Scoon

    ich vermute mal es geht um den Textbereich in der Mitte

    da ist eine Hintergrundfarbe definiert

    CSS
    .stk-53a7c56-container {
        background-color: var(--paletteColor8,#1f1f1f) !important;
        background-image: url(http://wordpress.wfp-design.com/wp-content/uploads/2022/01/textur_vita.gif) !important;
        background-repeat: repeat !important;
        background-size: auto !important;
        background-blend-mode: normal !important;
    }

    hier also transparent wählen, dann passt es

    CSS
    .stk-53a7c56-container {
        background-color: transparent !important;
        background-image: url(http://wordpress.wfp-design.com/wp-content/uploads/2022/01/textur_vita.gif) !important;
        background-repeat: repeat !important;
        background-size: auto !important;
        background-blend-mode: normal !important;
    }
  • Ja, die Hintergrundfarbe war es. Wäre ich nicht darauf gekommen, da ich davon ausgegangen war, dass ein Hintergrundbild die Hintergrundfarbe automatisch ausschließt bzw. ohne Hintergrundbild die Farbe transparent dargestellt wurde. Vielen Dank für die Hilfe!

Jetzt mitmachen!

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