diedVIPs

html knowhow

Bild beschriften















Bild beschriften

Damit können Sie ein Bild beschriften. Wo Sie die Platzierung des Textes wollen, können Sie selbst entscheiden.
So sieht´s aus

Snow
Unten links
Oben links
Oben rechts
Unten rechts
Zentriert
Quellcode
<html>
<head>

<style type="text/css">
.container {position: relative;text-align: center;color: white;}
.bottom-left {position: absolute;bottom: 8px;left: 16px;font-size:1.5em}
.top-left {position: absolute;top: 8px;left: 16px;font-size:1.5em}
.top-right {position: absolute;top: 8px;right: 16px;font-size:1.5em}
.bottom-right {position: absolute;bottom: 8px;right: 16px;font-size:1.5em}
.centered {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);font-size:1.5em}
</style>
</head>

<body>
 <div class="container">
<img src="../Bilder/Life.jpg" alt="Snow" style="width:100%;"/>
<div class="bottom-left">Unten links</div>
<div class="top-left">Oben links</div>
<div class="top-right">Oben rechts</div>
<div class="bottom-right">Unten rechts</div>
<div class="centered">Zentriert</div>
</div>
</body>

</html>







Kontakt    Datenschutz   Impressum