NAME

Quiq::Html::Image - Image-Block in HTML

BASE CLASS

Quiq::Hash

DESCRIPTION

Ein Objekt der Klasse repräsentiert einen Image-Block. Ein Image-Block stellt ein Bild alleinstehend dar, optional mit Link und Bildunterschrift.

Aufbau eines Image-Blocks:

[<div [class="CLASS"] [id="ID"] [style="STYLE"]>]
  [<a href="URL">]
  <img src="URL" width="WIDTH" height="HEIGHT" alt="ALT" />
  [<p>
    <span class="prefix">PREFIX:</span> <span class="caption">CAPTION</span>
  </p>]
  [</a>]
[</div>]

Die in eckige Klammern eingefassten Bestandteile ([...]) sind optional.

Das Aussehen des Image-Block kann via CSS gestaltet werden. Hier einige Selektoren, mit denen Bestandteile des Konstrukts in CSS angesprochen werden können:

.CLASS

Der gesamte Block.

.CLASS .prefix

Der Präfix-Text der Bildunterschrift ("Abbildung N:").

.CLASS .caption

Der Text der Bildunterschrift.

Hierbei ist CLASS der über das Attribut class setzbare CSS-Klassenname.

ATTRIBUTES

alt => $text

Alternativ-Text, wenn Bild nicht angezeigt wird.

caption => $text

Text der Bildunterschrift.

captionPrefix => $text

Präfix-Text der Bildunterschrift, z.B. "Abbildung 1:".

class => $name

CSS-Klasse des Image-Blocks.

height => $n

Höhe des Bildes in Pixeln.

href => $url

Hinterlege Bild mit einem Link auf URL $url.

id => $id

Die CSS-Id des Image-Blocks.

src => $url

Der URL des Bildes. Ist kein URL angegeben oder der Wert leer (undef oder Leerstring), wird von der Methode html() kein Image-Block erzeugt, sondern ein Leerstring geliefert.

style => $style

CSS-Properties des Image-Blocks (d.h. des <div>).

width => $n

Die Breite des Bildes.

EXAMPLES

Leerer Block, wenn kein Bild-URL

$class->html($h,
    src => '', # oder undef
);

produziert:

''

Block nur mit Bild

$class->html($h,
    src => 'illusion.png',
    width => 100,
    height => 100,
);

produziert:

<div>
  <img src="img/illusion.png" width="100" height="100" alt="">
</div>

METHODS

Konstruktor

new() - Instantiiere Verbatim-Block-Objekt

Synopsis

$e = $class->new(@keyVal);

Arguments

@keyVal

Liste von Attribut/Wert-Paaren. Die Werte werden auf dem Objekt gesetzt. Siehe Abschnitt ATTRIBUTES.

Returns

$e

Image-Block-Objekt (Referenz)

Description

Instantiiere ein Image-Block-Objekt und liefere eine Referenz auf dieses Objekt zurück.

Objektmethoden

html() - Generiere HTML-Code

Synopsis

$html = $e->html($h);
$html = $class->html($h,@keyVal);

Arguments

$h

Objekt für die HTML-Generierung, d.h. eine Instanz der Klasse Quiq::Html::Tag.

@keyVal

Siehe Konstruktor.

Returns

HTML-Code (String)

Description

Generiere den HTML-Code des Image-Blocks und liefere diesen zurück. Als Klassenmethode gerufen, wird das Objekt intern mit den Attributen @keyVal instantiiert.

VERSION

1.171

AUTHOR

Frank Seitz, http://fseitz.de/

COPYRIGHT

Copyright (C) 2020 Frank Seitz

LICENSE

This code is free software; you can redistribute it and/or modify it under the same terms as Perl itself.