Taufan Prihantoro: Perkenalan Dengan CSS

CSS

Pengertian

CSS merupakan suatu “kode” yang digunakan untuk mengatur atau mengedit suatu tulisan. Jadi CSS bukanlah bahasa pemograman. Sama seperti opsi style yang ada di Microsoft Word seperti bold, italic, underline, mengatur paragraf, mengatur spasi, warna background, warna teks, mengatur gambar, border, margin, bla-blablabalbla....

Jadi intinya CSS digunakan untuk mengedit tulisan, image, maupun border, dan masih banyak lagi. File CSS disimpan dengan ekstensi .css. Dengan adanya CSS setiap web mungkin memiliki style yang berbeda, karena CSS yang digunakan atau yang dibuat berbeda.

Sebelum Anda melanjutkan belajar CSS, diharapkan Anda telah mengerti tentang HTML dan beberapa tagnya, karena ini sangat penting sekali.

Perkembangan

Sampai saat ini terdapat 3 versi CSS, yaitu CSS1, CSS2, dan CSS3.
1. CSS1 dikembangkan pada pemformatan dokumen HTML.
2. CSS2 dikembangkan untuk memenuhi kebutahan terhadap format dokumen agar bisa ditampilkan di printer.
3. CSS3 dapat membuat suatu animasi di halaman web.

Ada tiga cara untuk memasukan CSS ke dalam HTML, yaitu dengan metode Inline Style Sheet, External Style Sheet, dan Internal Style Sheet.

11. Inline Style Sheet

Artinya CSS langsung ditulis di dalam tag HTML. Contoh:

<h1 style=”color:green;”>Hello world</h1>

h1=Tag HTML, yaitu Heading

style= Mendeskripsikan bahwa itu adalah CSS

color= salah satu attribute CSS

green= value.

Untuk mengetahui lebih lanjut mengenai attribute yang ada di CSS nanti akan saya bahas.

22. Internal Style Sheet

Seperti namanya, CSS ditulis di dalam HTML yaitu di bagian <head>.
Dengan tag <style> dan tag end </style>.

Contoh:

Hasilnya:

3. Eksternal Style Sheet

CSS ini berada di luar file html. Cara memasukannya dengan menuliskan:

Untuk pembahasan lebih lanjut saya tidak menggunakan Eksternal Style Sheet, karena lebih rumit.

Fakta CSS:

a) Telah didukung oleh banyak browser, tetapi tidak didukung oleh browser lama.

b) Lebih fleksibel.

c) Mempercepat memuat file HTML. Karena menggunakan tag HTML yang minimal, karena sudah dilaksanakan oleh CSS.

d) Dapat menampilkan konten utama terlebih dahulu, setelah itu barulah image ditampilkan.

e) Penerjemahaan CSS di setiap browser berbeda, tata letak akan berubah.

f) CSS adalah layouting “Masa Depan”

Ketergantungan

CSS tidak bisa lepas dari sebuah halaman web, karena tanpanya halaman web akan terasa tidak menarik. Hampir semua web yang ada di dunia maya menggunakan CSS. Lebih baik melihat web yang full color kan? Dari pada melihat web yang hitam putih (tahulah bagaimana rasanya menonton Televisi hitam putih).

Anda bisa surfing di search engine mengenai web yang menggunakan CSS tingkat tinggi. Banyak orang yang terkagum-kagum dengan keindahaan web tersebut, karena berbagai style yang menarik.

Tips

Salah satu web yang menyediakan tutorial CSS adalah tympanus.com. Disitu Anda bisa belajar, melihat web dengan CSS, dan mendownload file CSS. Dalam membuat web ada beberapa tahap yaitu:

1. Jelajah

Mengunjungi web yang anda sukai.

2. Lihat

Lihat struktur webnya seperti apa. Dan Anda aplikasikan ke html. Pahami script-script yang ada.

3. Edit

Mulailah mengedit struktur html tersebut. Tujuannya untuk memahami fungsi-fungsi dari script yang di edit.

4. Buat

Membuat web sendiri dari ilmu yang telah didapat dari step-step sebelumnya.

5. Coba dan ~~gagal~~

Mencoba web yang telah dibuat. Jika masih gagal itulah pengalaman baru yang didapat. Diamana letak salahnya, apa yang salah, dll. Cobalah untuk mengikuti sikap dari Thomas Alva Edison, yaitu dia menemukan 999 jalan menuju kegagalan untuk mengantarnya kepada tujuan.

Jadi kesimpulannya jangan takut GAGAL!. Jelajah, Lihat, Edit, Buat, Mencoba!

Itulah sedikit pembahasan mengenai CSS. Terima Kasih.

Baca juga: Kelebihan dan Kekurangan nge-Blog dan Blog