Cookie-Hinweis Smartphone

05.06.2013

Codes von Bildern mit und ohne Bildunterschrift

Die Codes von Bildern ohne Bildunterschrift sind entschieden anders als Codes von Bildern mit Bildunterschrift. Deshalb kann man nur Bilder der einen oder der anderen Sorte problemlos nebeneinander stellen. Gemischt können sie nicht so gut und leicht (nicht per Ziehen, nicht mittig, nicht auf exakt gleiche Höhe) nebeneinander gestellt werden. Man kann aber "Bildunterschrift" aktivieren und das Eintragsfeld leer lassen, dann kann man auch ein Bild ohne Text darunter neben eines mit Text darunter stellen.


Ohne Bildunterschrift


Ein mittig stehendes Bild, wie es im Web aussieht:


So sieht der Code dazu im HTML-Modus des Editors aus:

<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-6p9LemtHRXc/UWq5ehJEI4I/AAAAAAAAAOQ/XsSsawRO0h0/s1600/schweifkugel_10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/-6p9LemtHRXc/UWq5ehJEI4I/AAAAAAAAAOQ/XsSsawRO0h0/s1600/schweifkugel_10.jpg" /></a></div>

Elemente von außen nach innen:
  • DIV-Container
  • Bildanzeige-Link
  • Bild


Mit Bildunterschrift


Klickt man im Bildmenü auf "Bildunterschrift hinzufügen", wird der oben stehende Code sofort geändert, auch dann, wenn man gar nichts einträgt. Das Bild steht jetzt in einer Tabelle, die aus zwei Zeilen besteht, einer für das Bild und einer für die Bildunterschrift.

So sieht das im Web aus:

1

So sieht der Code dazu im HTML-Modus des Editors aus:

<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://3.bp.blogspot.com/-6p9LemtHRXc/UWq5ehJEI4I/AAAAAAAAAOQ/XsSsawRO0h0/s1600/schweifkugel_10.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" src="http://3.bp.blogspot.com/-6p9LemtHRXc/UWq5ehJEI4I/AAAAAAAAAOQ/XsSsawRO0h0/s1600/schweifkugel_10.jpg" /></a></td></tr>>
<tr><td class="tr-caption" style="text-align: center;">1</td></tr>
</tbody></table>

Elemente:
  • Tabelle und ihre Elemente
  • Bildanzeige-Link
  • Bild
  • Bildunterschrift


Ute Ziemes, sg.utez.de,

0 Kommentare:

Kommentar posten