RSS

STUDI KASUS WEB MODUL 3

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

  • Digg
  • Del.icio.us
  • StumbleUpon
  • Reddit
  • RSS

0 komentar:

Posting Komentar