Du kannst Bilder mit ein paar CSS-Zeilen zuschneiden, ohne Photoshop oder andere Bildbearbeitungsprogramme zu verwenden. Das ist nützlich, wenn die Vorschaubilder in einem mehrspaltigen Layout unterschiedlich hoch sind, wie unten.
VORHER
Die ungleichmäßigen Höhen der Vorschaubilder können das gesamte Layout leicht durcheinanderbringen.
CSS
Kopiere den Code unten und füge ihn in deine CSS-Datei ein.
img {
height: 200px;
object-fit: cover;
}
Probier object-position: 10% 10%; aus, wenn du die Position des Bildes innerhalb seines Bereichs verschieben möchtest.
NACHHER
Alle deine 20 bis 30 Vorschaubilder passen perfekt, und dein Layout sieht nicht mehr schief aus. Du kannst diese Methode auf jedes einzelne Bild deiner Webseite anwenden.