studi kasus modul 3


.








scriptnya ::


<!DOCTYPE html>
<html lang="en">
<head>
<title>Demo Rounded Border</title>
<style type="text/css">
<!--

.lingkaran2{
width:150px;
height:150px;
border: 2px solid brown;
border-radius:100px;
-moz-border-radius:100px;
-webkit-border-radius:100px;
background:#897048;
text-align:center;
font-size:18px;
color:#fff
}
.text-lingkaran{
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: 4px 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 class="lingkaran2">
<span class="text-lingkaran">
<br> ini contoh </br> border </br> Lingkaran ^_^
</span>
</div>

<br />
<div class="round2">
ini juga gaya border yang lain dan linenya diberi warna hijau
</div>
<br/>

<div class="shadow">
<p class="round3">ini border persegi dengan menggunakan efek shadow
</div>
<br/>
</body>
</html>

Your Reply