Wie kann ich ein Bild verkleinern und verschieben (Html, css)?
Ich programmiere eine Website. Und ich muss ein bild in der Mitte, oben platzieren.
1 Antwort
Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer
HTML, programmieren, CSS
Minimalbeispiel:
<!doctype html>
<title>Example</title>
<body style="margin: 0">
<article style="text-align: center">
<img alt="Image description ..." src="some-image.jpg">
</article>
</body>
Die horizontale Zentrierung erreichst du mit dem CSS-Property text-align.
Bei komplexeren Seiten macht es Sinn, dass CSS stärker zu separieren.
Die Größe des Bildes kannst du mit den Attributen height und width bestimmen. Beachte, dass Einheitsangaben im Wert nicht erlaubt sind. Es werden automatisch Pixeleinheiten verwendet.
<img alt="Image description ..." height="100" src="some-image.jpg" width="100">
Auch via CSS lässt sich die Größe ändern:
<img alt="Image description ..." src="some-image.jpg" style="height: 100px; width: 100px">
In dem Fall wird eine Einheitsangabe (px / % / o.ä.) hinter dem Wert erwartet.