Styling von Bildern, die per PHP ausgegeben werden

[Nils-Hendrik]

Hallo liebe Community,

kurz zusammengefasst: Ich entnehme Daten aus einer MySQL Datenbank und gebe diese mithilfe eines PHP Skriptes aus. Die Daten (1 oder 0) werden als Bild_1 oder Bild_2 dargestellt. Das funktioniert auch wunderbar.
Allerdings muss ich diese nun etwas stylen (hauptsächlich per marginverschieben).
Height und Width funktioniert dabei wunderbar, sprich die Größe kann ich verändern, allerdings nicht das verschieben der Bilder im HTML Dokument. Kann mir evtl. jemand den Code so anpassen, dass ich die Bilddateien per margin einfach ein wenig verschiebe?

foreach ($pdo->query($sql) as $row)
        if ($row['status'] == '1') {
    $image = "test";}
        else {
    $image = "test1";}

    echo '<img src="img/' . $image . '.png" height="70%" width="35%" title="Fire" alt="Fire" />';
?> 

Vielen Dank!

[jspit]

Versuche es doch selbst erstmal indem du CSS benutzt. Unter den Schlagwort findest du auch etliche Grundlagen-Tutorials. s.a. CSS Styling Images.

[hellbringer]

$imageFilename = $row['status'] ? 'status_foo.jpg' : 'status_bar.jpg';
$className = $row['status'] ? 'status-foo' : 'status-bar'; 

<img src="img/<?= htmlspecialchars($imageFilename, ENT_COMPAT, 'UTF-8') ?>"
     class="<?= htmlspecialchars($className, ENT_COMPAT, 'UTF-8') ?>"
     title="Fire"
     alt="Fire" />

[protestix]

Das hat nichts mit PHP zu tun.
Bilder verhalten sich wie Text, sie haben die Display Eigenschaft inline. Eine Eigenschaft margin bleibt daher wirkungslos. Deshalb muss man die Eigenschaft Display ändern. Ausserhalb von Text zum Beispiel auf block und innerhalb von Text auf inline-block.
Siehe dazu auch https://wiki.selfhtml.org/wiki/CSS/E...nzeige/display

[Nils-Hendrik]

Das hat nichts mit PHP zu tun.
Bilder verhalten sich wie Text, sie haben die Display Eigenschaft inline. Eine Eigenschaft margin bleibt daher wirkungslos. Deshalb muss man die Eigenschaft Display ändern. Ausserhalb von Text zum Beispiel auf block und innerhalb von Text auf inline-block.
Siehe dazu auch https://wiki.selfhtml.org/wiki/CSS/E...nzeige/display

Hallo, danke für deinen Hinweis. Ist es also direkt in dem PHP Skript wie ich es aktuell verwende nicht möglich die Bilder z.B. nach unten zu verschieben?

[hellbringer]

Hallo, danke für deinen Hinweis. Ist es also direkt in dem PHP Skript wie ich es aktuell verwende nicht möglich die Bilder z.B. nach unten zu verschieben?

Für das Aussehen ist CSS zuständig und nicht PHP/HTML. Folglich gehört sowas in eine CSS-Datei.

[hausl]

MOD: Verschoben von PHP Einsteiger