| Nilai | Keterangan |
|---|---|
| visible | Ini akan membuat limpahan terlihat. Ini default |
| hidden | Ini akan membuat limpahan terpotong, dan sebagian bersembunyi atau tidak terlihat |
| scroll | Ini akan membuat limpahan terpotong, dan sebagian bisa dilihat dengan scroll-bar |
| auto | Jika konten belum penuh dia akan tampil biasa. Dan jika konten sudah penuh dengan automatis menampilkan scroll-bar |
Buka Notepad untuk mempraktekkannya, copy-paste kode ini :
<html>
<head>
<style type="text/css">
.satu {
background-color:#FFE5FF;
width:100px;
}
.dua {
background-color:#FFE0B3;
width:100px;
height:100px;
overflow:hidden;
}
.tiga {
background-color:#E5E5FF;
width:100px;
height:100px;
overflow:scroll;
}
.empat {
background-color:#FFFFE5;
width:100px;
height:100px;
overflow:auto;
}
</style>
</head>
<body>
<p>visible - digunakan atau tidak sama saja, kecuali mewarisi. Lebih baik tidak menggunakan properti height.</p>
<div class="satu">contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh</div>
<p>hidden</p>
<div class="dua">contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh</div>
<p>scroll</p>
<div class="tiga">contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh</div>
<p>auto pertama</p>
<div class="empat">contoh contoh contoh contoh</div>
<p>auto kedua</p>
<div class="tiga">contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh contoh</div>
</body>
</html>
Menu Nano di Halaman utama juga menggunakan trik overflow.
Alhamdulillah
0 comments:
Posting Komentar