Keuntungan menggunakan CSS, anda dapat :
1. Menentukan tampilan dari halaman-halaman web dalam sebuah tempat tanpa mengulanya kembali melalui script HTML anda.
2. Dengan mudah mengubah tampilan dari halaman-halaman web walaupun setelah halaman tersebut dibuat.
3. Menentukan ukuran font dan atribut-atribut yang sejenis dengan sebuah "word processor" dan tidak dibatasi hanya untuk tujuan ukuran font berbedayang telah diterapkan oleh HTML.
4. Menentukan isi hingga ukuran pixel dari tiap halaman web dengan akurat.
5. Menentukan kembali keseluruhan tag-tag HTML. sebagai contoh, anda dapat dengan mudah membuat tebal tag menjadi berwarna yang anda mau menggunaka font yang spesial
6. Menentukan style yang kita inginkan untuk sebuah link, seperti menyingkirkan garis bawah yang biasa terlihat di link.
7. Menentukan layer-layer yang dapat diposikan di atas layer-layer lainnya (kadang di gunakan untuk menu-menu menjadi menarik).
8. Halaman web anda akan di load lebih cepat, karena tidak diisi dengan tag-tag yang mengatur tampilan web.
Tapi CSS memiliki satu kekurangan, yaitu :
CSS hanya dapat bekerja dalam browser versi 4 atau lebih. Namun dewasa ini lebih dari 95% dari keseluruhan browser telah banyak yang mendukungnya. jadi kekhawatiran tentang tidak dapat ditampilkannya situs yang yang kita buat menggunakan CSS akan makin terkikis.
MEMBUAT BAYANGAN LAYER
Salah satu penggunaan properti "z-index" adalah untuk menciptakan bayangan (drop shadow). Contoh berikut adalah penerapan z-index untuk membuat bayangan :
<html>
<head><title>membuat bayangan dengan layer</title>
<style>
.posisi1 {position:relative; top:15; left:25; z- index:10; color:#00000; font- family:Arial; font- size:25pt}
.posisi2 {position:relative; top:-22; left:28; z- index:6; color:#00ccff; font- family:Arial; font- size:25pt}
.posisi3 {position:relative; top:-59; left:29; z- index:6; color:#ff00ff; font- family:Arial; font- size:25pt}
</style>
</head>
<body>
<div class="posisi1">bayangan dengan layer</DIV>
<div class="posisi2">bayangan dengan layer</DIV>
<div class="posisi3">bayangan dengan layer</DIV>
</body>
</html>
NESTING
<html>
<head><title>nesting</title>
<style>
#atas {background-color: #ccc; padding:2em}
#atas h1 {color: #ff0;}
#atas p {color: red; font-weight: bold;}
</style></head>
<body>
<div id="atas">
<h1>menyingkat CSS dengan nesting </h1>
<p>penyingkatan ini menggunakan cara nesting</p>
<p>mudah kan....!!!</p>
</div>
</body>
</html>
Dua script di atas adalah contoh kecil dalam menerapkan CSS di web anda, dan masih banyak script yang lain, jadi tunggu postingku yang berikutnya...........
Moga bermanfa'at ea.....[^ _ -]
0 komentar:
Posting Komentar