diedVIPs

html knowhow

Runde Bilder










Runde Bilder

Fügen Sie einem Bild mit der Eigenschaft "border-radius" abgerundete Ecken zu:
So sieht´s aus

Radius 50 % Radius 20 % Radius 10 %
Avatar Avatar Avatar


Quellcode
<html>
<head>
<style type="text/css">
#img1 {border-radius: 50%;}
#img2 {border-radius: 20%;}
#img3 {border-radius: 10%;}
</style>
</head>

<body>
<table style="width: 100%">
<tr>
<td>Radius 50 %</td>
<td>Radius 20 %</td>
<td>Radius 10 %</td>
</tr>
<tr>
<td><img id="img1" src="../Bilder/Life.jpg" alt="Avatar" style="width:200px"/></td>
<td><img id="img2" src="../Bilder/Life.jpg" alt="Avatar" style="width:200px"/></td>
<td><img id="img3" src="../Bilder/Life.jpg" alt="Avatar" style="width:200px"/></td>
</tr>
</table>

</body>

</html>







Kontakt    Datenschutz    Impressum