SCRIPT
<!DOCTYPE html>
<html lang="en">
<head>
<title>Demo Kreasi Border</title>
<style type="text/css">
<!--
#lingkaran{
width:200px;
height:200px;
border: 3px solid brown;
border-radius:100px;
-moz-border-radius:100px;
-webkit-border-radius:100px;
background:#F08080;
text-align:center;
font-size:18px;
color:#008080
}
#text-lingkaran{
padding-left: 100px;
padding-top: 100px;
}
#round2 {
-moz-border-radius-bottomright: 25px 25px;
border-bottom-right-radius: 25px 25px;
-moz-border-radius-topleft: 25px 25px;
border-top-left-radius: 25px 25px;
border: 3px solid green;
padding: 10px;
width: 270px;
height: 30;
}
#round3 {
border: 2px solid #897048;
padding: 10px;
}
#shadow {
width: 300px;
box-shadow: 5px 5px 7px #222;
-moz-box-shadow: 5px 5px 7px #222;
-webkit-box-shadow: 5px 5px 7px #222;
}
-->
</style>
</head>
<body>
<p>
<div id="lingkaran">
<span id="text-lingkaran">
<br><br><br> Yang ini border Lingkaran!!
</span>
</div>
<br>
<div id="round2">
Bisa juga bikin kreasi border seperti ini.<br>
Hmmmm....... ^_^
</div>
<br>
<div id="shadow">
<p id="round3">Efek Shadow...
</div>
</body>
</html>
hasilnya
STUDI KASUS WEB MODUL 3
06.49 |
Langganan:
Posting Komentar (Atom)
0 komentar:
Posting Komentar