Hintergrundfarbe bei Texten

  • Hallo in die Runde,


    ich möchte gerne ein bekanntes Problem lösen. In meinem "body" soll ein Hintergrundbild. Damit man aber dennoch den Text (Navigation und Beiträge...) lesen kann, möchte ich entsprechende weiße Kästen haben. Orientiert habe ich mich hier. Leider bekomme ich es nicht realisiert. Entweder ist alles transparent oder gar nichts. Egal wie, gelesen werden kann gar nichts.


    Hier ist mein Code:

    Wie in einem anderen Thread beschrieben, wollte ich also bei den Menüs überall als Seitenklasse "hintergrund1" angeben. Das macht aber keinen Unterschied und ich finde meinen Fehler nicht. Könnt ihr mir bitte weiterhelfen? Vielen Dank!

    cnp


    Joomla 3.9.26

    PHP 7.4.16

  • Ich weiß nicht, ob ich dich richtig verstanden habe. Aber im einfachsten Fall könntest du so etwas in dieser Art machen:


    Code
    <div style="background-color: #fff; border:1px solid #ccc; padding: 20px;">
      ....dein Text...
    </div>

    Besser über eine Klasse machen!

    Ansonsten bräuchte man einen Link zur Seite!

  • Die Box ist nur um den Text herum. Deswegen kann ein padding sinnvoll sein. Das Bild bleibt dahinter.


    Wenn du die Formatierung in eine Klasse in die user.css setzt, dann kannst du die Klasse überall anwenden, z.B

    <div class="weisse-box">Text</div>


    Ich persönlich finde Hintergrundbilder immer schwierig. Sie sollten dezent sein, um nicht abzulenken. Beachte auch die mobile Darstellung!

  • Wenn ich also weisse-box als Klasse habe, sähe das in der user.css als .weisse-box aus oder wie? Und <div class="weisse-box">Text</div> käme in den Artikel? Ist es das, was bei dem anderen Thread als hintergrund1 gesetzt wurde?



    Ich persönlich finde Hintergrundbilder immer schwierig. Sie sollten dezent sein, um nicht abzulenken. Beachte auch die mobile Darstellung!

    Mein Problem ist, dass man auf der Seite nicht erkennt, dass es inhaltlich um Kirche geht. Also wollte ich ein entsprechendes Hintergrundbild (Luther wg. Lutherkirche) einfügen. Wenn ich es dort habe, wo der blaue Rand ist, sieht man den Inhalt gar nicht, es ist unruhig und damit nicht zielführend. Darum wollte ich es hinter dem Text haben. Luther würde damit genau in der Lücke zwischen linksbündigem Text und rechten Seitenmodulen sein. Darum muss der Hintergrund auch transparent sein. Sonst sieht man ja wieder nichts und ich lasse es besser beim Alten.

  • Ich stelle gerade fest, dass ich ja tatsächlich schon erreicht habe, was ich erreichen wollte. Gestern hatte er es mir noch nicht angezeigt. Und ja, es sieht tatsächlich doof aus. Kann ich denn die Hintergrundfarbe selbst transparent machen? Aber dann kann ich den Text auch wieder nicht lesen oder? Ich hatte jetzt folgende Ergänzung probiert:

    Das scheint keinen Sinn zu machen.


    Im Anhang findet ihr übrigens das Ergebnis von obigem Code. Da ist Luther ja auch komplett verdeckt...

  • Ha, das war die Lösung! Vielen Dank!

    Jetzt noch die Module anpassen und dann müsste es passen. Vielen Dank!

  • Eventuell einfach oben ein großes Bannermodul bzw. Slidermodul nutzen!

    Ich würde die Schrift zugunsten der Lesbarkeit schon auf einen einfarbigen Hintergrund ohne große Transparenz setzen. Aktuell wäre mir das zu unruhig. Ist natürlich nur meine persönliche Meinung.


    Ev. könnte man das Protostar auch auf gesamte Breite setzen.