Bilder mit Schatten und ohne Schatten auf der gleichen Seite

  • Joomla Version
    6.0.3
    PHP Version
    PHP 8.4.x
    Hoster
    UD-Media
    Link (URL) zur Seite mit dem Problem
    https://gmpcambodia.org/de/die-chance

    Ich möchte den einen Bildern Schatten geben, anderen, auf der gleichen Seite aber nicht.
    Wie kann ich das erreichen?

    Einen Schatten zu machen ist mir per user.css gelungen:

    img {
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.35);
    }

    Wie muss ich vorgehen um das Bild mit dem Logo davon auszuschließen?

  • Das machst du, indem du eine Bildklasse erstellst und dann nur dem Beitrag zuordnest, der den Schatten haben soll.

    Deinem Code stellst du dann z.B. .schatten voran. Dann diese Klasse schatten im Beitrag beim Bild unter Bildklasse hineinschreiben aber ohne den Punkt.

    .schatten img {
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.35); 
    }

  • Du musst nur den CSS Code in der user.css abändern, wie von WM-Loose gepostet. Dann hast du die Klasse "schatten" erstellt und kannst diese z.B. den jeweiligen Bildern zuordnen. Image-Manager = Medienmanager? Sollte unter classes funktionieren. Oder im Code beim Bild sonst einfach <img class="schatten"....> Also der CSS Code dann nicht mehr direkt beim Bild enthalten, sondern nur die Klasse. Vorteil: Du kannst alle Bilder, die dieser Klasse zugewiesen sind, mit nur einer Änderung in der user.css ändern.

  • Ich hätte auch nur "schatten" eingegeben, da das die Klasse ist, aber wenn es so funktioniert, dann wird es schon passen.

    Vermutlich befindet sich die vorgebene Klasse "shadow" bereits in der user.css.

  • Es wäre sonst möglich, die bestehende Klasse "shadow" in die user.css einzufügen (also .shadow...) und jeden Wert darin mit !important abschließen, dadurch erhält der Befehl die höchste Priorität und überschreibt alle anderen CSS-Angaben.

    Beispiel: .shadow {box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.35) !important;}
    (sofern die Klasse .shadow wirklich vorhanden ist und genauso heißt)