Senin, 14 Februari 2011

PRaktikum pemrograman web modul 3

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