Untuk membuat bentuk-bentuk seperti lingkaran, segitiga, persegi panjang dan bentuk-bentuk yang lain pada CSS, kita dapat membuatnya dengan memainkan height dan width serta radius sesuai dengan bentuk yang kalian inginkan.
di bawah ini terdapat beberapa bentuk yang dibuat dengan CSS....
Lihat codenya di bawah ini...
<!DOCTYPE html>
<html lang="en">
<head>
<title>Demo Rounded Border</title>
<style type="text/css">
<!-- .round1 {
background-color: #0573fb;
-moz-border-radius: 250px;
-webkit-border-radius: 50px;
border: 2px solid black;
padding: 50px;
width: 100px;
height: 100px
font-family: courier;
color: white;
}
.round2 {
background-color: #ddccb5;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
padding: 20px;
width: 300px;
height: 50px;
border: 4px solid #897048;
}
.round3 {
background-color: #3ef572;
-moz-box-shadow: 10px 10px 5px #222;
box-shadow: 10px 10px 5px #222;
border: 2px solid #05912c;
padding: 30px;
width: 200px;
height: 50px;
}
-->
</style>
</head>
<body>
<h1>Rounded Border</h1>
<div class="round1">
Ini lingkaran.. hehehehe... gampang lhoo biqin lingkaran
</div>
<br />
<div class="round2">
pembuatan rounded border menggunakan css3 memang sangat mudah. tidak perlu file gambar sama sekali, seperti pada css sebelumnya
</div>
<br />
<div class="round3">
biqin shadooow.... baguuus.. hho.. gampang juga lhooo...
</div>
</body>
</html>
selamat mencobaaaa!!!!
Tidak ada komentar:
Posting Komentar