Wir kennen das alle: Sie surfen auf einer Website mit unzähligen riesigen Bildern von köstlichem Essen oder vielleicht dem neuen Gadget, das Sie ins Auge gefasst haben. Diese Bilder sprechen Ihre Sinne an und sind für Content-Autoren unerlässlich...
Das Folgende ist ein Gastbeitrag von Damon Bauer, der eine ziemlich übliche Aufgabe für Webentwickler behandelt: das Anbieten von Benutzerbild-Uploads. Ich würde zögern, es als einfach zu bezeichnen, aber mit Hilfe einiger leistungsfähiger Werkzeuge, die eine ...
In diesem Artikel von Colt McAnlis gibt es viele nette Tricks, um die Größe von JPGs zu reduzieren.
…Da die durchschnittliche Webseiten-Größe inzwischen größer ist als das ursprüngliche DOOM-Spiel, muss man sich fragen, wo all die Bytes geblieben sind.
Der folgende Artikel ist ein Gastbeitrag von Aleks Hudochenkov. Aleks macht hier einen großartigen Job, indem er zeigt, wofür PostCSS gut ist und welche Rolle es im Frontend-Stack eingenommen hat. Das heißt: nützliche kleine ...
object-fit und object-position sind meine beiden Lieblings-CSS-Eigenschaften in letzter Zeit. Sie geben Entwicklern Kontrolle über den Inhalt innerhalb eines img oder eines video, ähnlich wie wir den Inhalt eines background mit background-position und background-size manipulieren können...
Wenn Sie ein Bild über den WordPress-Medien-Uploader hochladen und es dann in den Editor einfügen, wird es mit Breiten- und Höhenattributen versehen. Diese sind normalerweise wünschenswert, da sie dem Browser helfen, den entsprechenden Platz für das ... zu schaffen.
Fehlende Bilder zeigen entweder nichts an oder eine Box im Stil von [ ? ], wenn ihre Quelle nicht gefunden werden kann. Stattdessen möchten Sie vielleicht eine "fehlende Bild"-Grafik einfügen, von der Sie wissen, dass sie existiert, damit es ...
Erstellen Sie ein Div, das exakt die Größe des Bildes hat. Dieses Div erhält ein Hintergrundbild des zweiten Bildes. Fügen Sie dann ein Inline-Bild darin ein.
<div id="kitten" style="background-image: url(dog.jpg);">
<img src="/images/kitten.jpg" alt="Kitten" />