Studi Kasus
Source kode html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Posisi Division</title>
<style type="text/css">
<!--
.box {
padding: 10px;
width: 200px;
height: 200px;
background: #00ff00;
border: 4px double black;
-moz-border-radius: 150px;
}
#teks{
width: 75px;
height: 75px;
}
.box1 {
padding: 10px;
width: 400px;
height: 60px;
background: #cc0099;
border: 5px solid blue;
border-top-right-radius: 30px;
border-bottom-left-radius: 30px;
text-align: center;
}
.box2 {
padding: 10px;
width: 400px;
height: 60px;
background: #6633ff;
border: 5px solid pink;
-moz-box-shadow: 10px 10px 20px rgb(60,0,0,0);
text-align: center;
}
-->
</style>
</head>
<body>
<div class="box" align="center">
<p id="teks">
Contoh Box berisi teks. Ternyata box bisa di buat lingkaran.
</p>
</div>
<br>
<br>
<div class="box1">
Box yang berwarna warni dapat mententramkan hati. selamat mencoba box warna warni......
</div>
<br>
<br>
<div class="box2">
Berikut ini contoh box yang mempunyai bayangan hitam yang indah. dapatkah kamu mencoba??
</div>
</body>
</html>
Tampilan web
Tidak ada komentar:
Posting Komentar