diedVIPs

html knowhow

Runde Buttons










Runde Buttons

Fügen Sie einer Schaltfläche mit der Eigenschaft "border-radius" abgerundete Ecken zu:
So sieht´s aus



Quellcode
<html>
<head>
<style type="text/css">
.button {background-color: lightblue; border: none; color: red; padding: 20px; text-align: center; text-decoration: none; display: inline-block;
font-size: 16px; margin: 4px 2px; cursor: pointer;}
.button1 {border-radius: 2px;}
.button2 {border-radius: 4px;}
.button3 {border-radius: 8px;}
.button4 {border-radius: 12px;}
.button5 {border-radius: 50%;}
</style>
</head>

<body>
<button class="button button1">2px</button>
<button class="button button2">4px</button>
<button class="button button3">8px</button>
<button class="button button4">12px</button>
<button class="button button5">50%</button>
</body>

</html>







Kontakt    Datenschutz    Impressum