Pengertian Dan Fungsi CSS - Jika kita sering mencari tutorial-tutorial tentang blog, maka hampir bisa dipastikan kita pasti sering bertemu dengan yang namanya
CSS. Sebenarnya apa sich
CSS itu?
CSS (Cascading Style Sheet) merupakan salah satu bahasa pemrograman web yang digunakan untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. Penggunaan
CSS ini tidak lepas dari kode-kode HTML. Ibarat kata kita adalah Arsitek yang akan membangun sebuah rumah, maka paling tidak kita harus mengetahui secara pasti mulai dari ukuran tanahnya. Kemudian seberapa luas rumah yang ingin kita bangun, berapa buah dan berapa luas kamar, ruang tamu, beranda, serta ruang utamanya.
Untuk bisa melihat perbedaannya maka anda bisa mencoba langsung dengan mengetikkan atau mengcopy kode dibawah ini di notepad.
- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
- <html>
- <head>
- <title>Percobaan HTML saya yang pertama</title>
- </head>
-
- <body>
-
- <h1>Halaman pertama</h1>
-
- <p>Selamat datang ke halaman pertama saya!
-
- <p>Halaman ini tidak ada gambar, hanya berisi berapa kata.</br>
- Tidak memiliki link yang bisa merujuk kemana-mana. </br>
- Harap maklum karena ini hanyalah halaman percobaan…</br>
- <p>Disini seharusnya ada lebih banyak lagi,</br>
- tetapi saya belum tahu apa yang ingin saya tulis lagi.
- <address>Dibuat 15 Desember 2011</br>
- oleh diriku sendiri.</address>
-
- </body>
- </html>
Simpan hasilnya dengan format .html (* contoh: percobaan pertama.html) dan jangan lupa untuk mengubah extensi atau type file menjadi all files.
Maka setelah dibuka kira-kira kita hanya akan mendapatkan hasil seperti ini:
Preview :
Setelah kita lihat hasilnya, pasti kita akan merasa banyak sekali kekurangan. Hal itu di karenakan memang karena disitu kita tidak melihat ada style sama sekali.
Nah, kira-kira disinilah fungsi dari
CSS ini. Dalam pembuatan sebuah website atau blog,
CSS dapat kita gunakan dalam mengendalikan ukuran gambar, warna teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse hover, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, bahkan untuk membuat bayangan dari objek dan parameter lainnya.
CSS bisa juga diartikan sebagai bahasa style sheet yang digunakan untuk mengatur tampilan dokumen. Oleh karena itu pula, untuk mengerti
CSS ini maka mau tidak mau, paling tidak kita harus sedikit tahu tentang HTML.
Sekarang kita akan berikan tambahan sedikit polesan dengan
CSS.
Semisalnya kita ingin Website/Blog kita mempunyai latar warna hitam dan tulisan putih. Maka kita cukup menambahkan kode seperti dibawah ini dan meletakkannya atas kode </head>.
- <style type="text/css">
- body {
- color: white;
- background-color: black; }
- </style>
Maka kita langung akan mendapatkan hasil seperti yang kita inginkan sesuai CSS diatas.
Preview :
Nah, disini kita telah melihat sedikit fungsi dari
CSS ini. Hanya dengan penambahan 2 baris kode saja, tapi sudah bisa membuat pengaturan yang sedemikan rupa. Tentu saja semua tidak berhenti disitu saja. Seperti yang sebelumnya dikatakan, bahwa dengan kode
CSS ini kita bisa gunakan dalam mengendalikan ukuran gambar, warna teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse hover, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, bahkan untuk membuat bayangan dari objek dan parameter lainnya. cukup sekian ajah ya penjelasannya, kalau kurang jelas silahkan berkomentar :)
