Ecken bei Fotos und Banner - abgerundet - einstellbar

Hallo Axel,

abgerundete Bilder könntest Du bspw. mit

<style>
img {
border-radius: 10px;
}
</style>

unter „Einstellungen > CSS“ erreichen. Den Pixel-Wert müsstest Du wahrscheinlich noch anpassen. Der Nachteil dieser Methode ist allerdings, dass es sich auf alle Bilder gleichermaßen auswirkt. Das schließt zum Bespiel auch Dein Logo mit ein.

Schau mal, ob das für Dich eine befriedigende Lösung darstellt. Ansonsten müsste man verschiedene Klassen mit unterschiedlich starken Rundungen anlegen, und jedem Bild je nach Größe eine entsprechende Klasse (im Widget unter „Schiebregler > Mehr > CSS-Klasse“) zuweisen.

Viele Grüße

Tom

Zitat von Drcymbal

Hallo Axel,

abgerundete Bilder könntest Du bspw. mit

Code

<style>
img {
border-radius: 10px;
}
</style>

unter „Einstellungen > CSS“ erreichen. Den Pixel-Wert müsstest Du wahrscheinlich noch anpassen. Der Nachteil dieser Methode ist allerdings, dass es sich auf alle Bilder gleichermaßen auswirkt. Das schließt zum Bespiel auch Dein Logo mit ein.

Schau mal, ob das für Dich eine befriedigende Lösung darstellt. Ansonsten müsste man verschiedene Klassen mit unterschiedlich starken Rundungen anlegen, und jedem Bild je nach Größe eine entsprechende Klasse (im Widget unter „Schiebregler > Mehr > CSS-Klasse“) zuweisen.

Viele Grüße

Tom

Alles anzeigen

Erst einmal VIELEN DANK... ich probiere es aus und gebe Rückinfo... SCHATTEN ist auf dem Weg nicht möglich, richtig?

LG Axel

Hallo Axel.

Ich habe das, mithilfe einiger Experten hier, mit CSS folgendermaßen gelöst:

CSS-Klasse: img-schatten

CSS:

<style>
/* Erzeugt einen Schatten bei Bildern mit CSS-Klasse img-schatten */
.img-schatten {
-webkit-filter: drop-shadow(5px 8px 8px #000);
filter: drop-shadow(5px 8px 8px #000);
overflow: visible; /* Sorgt dafür, dass der Schatten nicht abgeschnitten wird */
}

.img-schatten img {
border-radius: 10px; /* Gibt dem Bild runde Ecken mit CSS-Klasse img-schatten */
}
</style>

Die Klasse fügst du unter "Einstellungen" >> "CSS" ein. Und jedes Bild welches den Effekt erhalten soll, erhält die CSS-Klasse "img-schatten".

Sehen kann man den Effekt auf meiner Indexseite.

Zitat von Drcymbal

Hallo Axel,

abgerundete Bilder könntest Du bspw. mit

Code

<style>
img {
border-radius: 10px;
}
</style>

unter „Einstellungen > CSS“ erreichen. Den Pixel-Wert müsstest Du wahrscheinlich noch anpassen. Der Nachteil dieser Methode ist allerdings, dass es sich auf alle Bilder gleichermaßen auswirkt. Das schließt zum Bespiel auch Dein Logo mit ein.

Schau mal, ob das für Dich eine befriedigende Lösung darstellt. Ansonsten müsste man verschiedene Klassen mit unterschiedlich starken Rundungen anlegen, und jedem Bild je nach Größe eine entsprechende Klasse (im Widget unter „Schiebregler > Mehr > CSS-Klasse“) zuweisen.

Viele Grüße

Tom

Alles anzeigen

Zitat von axelemden

[…]

Vielen Dank