MachHTML - Tool

Bilder Responsive in HTML (<img>Tag)

Dieses kleine Tool erstellt den responsive HTML-Code für ein Bild. Optional läßt sich die maximale Breite und eine Zieladresse angegeben, die sich dann beim Mausklick auf das Bild öffnet. So kann z.B. das Bild beim Klick in der originalen Größe angezeigt werden.

Dafür ist nur die Bild-URL erforderlich. Weitere Angaben sind optional!

Bild-URL: Erforderlich: Bildadresse - Wo ist das Bild?
Infotext title: optional: Dieser Text wird angezeigt, wenn man mit der Maus über dem Bild steht. Für Suchmaschinen ist dieser Text wichtig.
Alternativtext alt: optional: Dieser Text wird angezeigt, während das Bild geladen wird oder wenn es nicht angezeigt werden kann.
Maximale Breite max-width: optional: Falls nicht die Original-Breite verwendet werden soll.
Rahmen:


oder Farbwert-Eingabe:
optional: Das Bild kann auch einen Bilderrahmen bekommen.
Mit einem Klick auf den kleinen Farbkreis öffnet sich der Farbwähler in einem neuen Fenster. Ein Farbwert kann aus dem Farbwähler kopiert und hier im Feld für die Farbwert-Eingabe eingefügt werden. Wenn kein Wert in der Farbwert-Eingabe steht, wird die Farbe aus der Auswahlliste genommen.
Ziel-Adresse: optional: Diese Seite soll beim Klick auf das Bild geöffnet werden. Es kann auch die Adresse zu einem größeren Bild angegeben werden!
neues Fenster: optional: Wenn angehakt, wird das Linkziel in einem extra Browserfenster geöffnet.


Tipps

  • Wird bei Ziel-Adresse nochmal die selbe Bild-URL eingetragen, wird das Bild beim Anklicken in der originalen Bildgröße angezeigt. So lassen sich Bilder Platzsparend in Texten platzieren.
  • Der Code kann in ein HTML-Feld des Vorlagen-Generators eingefügt werden
  • Für das HTML-Feld im Generator kann eine Hintergrundfarbe ausgewählt werden, wodurch ein zweiter Rahmen entsteht
  • Wird das HTML-Feld in einer extra Reihe angelegt, kann dafür noch ein extra Rahmen gewählt werden

nach oben

© 2008-2017 Constanze Strauss www.seitenschritt.de - Letzte Aktualisierung am 01.07.2017