All About CSS
Assalamu'alaikum para Blogger. hehe
Ternyata, sudah lama sekali ya? saya belom posting di blog ini, kira-kira sudah 4 bulan-an saya belum ngepost apapun di tempat ini. Memang juga, akhir-akhir ini, saya jadi sedikit males posting artikel blog.
Yah, dan akhirnya, beberapa hari lalu, ada beberapa teman, yang dengan iklashnya menanyakan permasalahan blognya kepada saya, terutama bagian CSS inih. Pada postingan ini, kita akan coba bahas full CSS, dari modelnya, dimana memasangnya, pokoknya semua tentang CSS. O'iya, sebelumnya, saya juga pernah mengambil artikel dari Wikipedia tentang CSS, dan telah saya post di blog ini. Mungkin yang belum tau babar blas tentang CSS, bisa baca postingan saya sebelumnya, yang berjudul "CSS Adalah" (baca). Nah, disitu, anda akan tau apa itu CSS, sejarah, sekaligus contohnya...
CSS tuh artinya, Cascading Style Sheet. Kalo nggak salah. Dan, ternyata nggak salah..!! hehehe. Sekarang waktunya kita untuk lanjut ke inti post ini. CSS Attack..!
Pertama, seperi biasanya, siapkan dulu alat dan bahan untuk belajar CSS ini. Seperti texs editor, mental yang kuat, jari yang tangguh, dan lainnya. Untuk teks editor, anda bisa memakai notepad, seperti pada post-post saya yang terdahulu.
Pada postingan yang lalu (baca) disitu dijabarkan bahwa CSS mempunyai 2 sifat, yaitu Internal dan Eksternal. Sifat yang pertama adalah Internal, maksudnya, CSS itu dimasukkan kedalam kode HTML halaman websitenya. Internal itu sendiri dibedakan menjadi dua lagi, yaitu Inline Style Sheet dan Embedded Style Sheet.
Kita menuju yang Embedded CSS dulu. Pada Embedded CSS, CSS itu sendiri diletakkan di antara tag <head> dan </head>.
Eiitsss, tapi, CSS itu sendiri harus diletakkan diantara tag <style>. Contohnya gini:
Eiitsss, tapi, CSS itu sendiri harus diletakkan diantara tag <style>. Contohnya gini:
<html>
<head>
<style>
H1
{ color:black }
</style>
</head>
<body>
<h1>Blog Lintang</h1>
</body>
</html>
Contohnya kurang lebih seperti ituh. Nahh.., diatas itu, anda bisa perhatikan bahwa CSS dibungkus oleh tag <style>, dan tag <style> tersebut diletakkan diantara tag <head>.
Sekarang kita, CSS Internal kedua yang harus diketahui adalah CSS model Inline Style Sheet. Untuk tipe ini, CSS sendiri diletakkan secara langsung dengan elemen yang akan ditampilkan di Blog/Website.
Contohnya dibawah ini
<html>
<head>
</head>
<body>
<p align="left"><font face="Andalus" size="4">Blog Lintang</font></p>
</body>
</html>
<head>
</head>
<body>
<p align="left"><font face="Andalus" size="4">Blog Lintang</font></p>
</body>
</html>
Lalu, kurang satu lagi, yaitu Eksternal CSS. Eksternal CSS ini, mempunyai cara yang agak rumit bin ribet, maksudnya, selain anda membuat harus CSSnya, anda harus mengupload file CSS ini ke hosting. Ya, pokoknya gitu..
Contohnya Eksternal CSS, itu seperti ini
<html>
<head>
<link href='sampleCSS.css' rel ='stylesheet' type='text/CSS'>
</head>
<body>
<p>Coba teks dengan Eksternal CSS</p>
</body>
</html>
Nah, diatas, tag <link href='sampleCSS.css' rel ='stylesheet' type='text/CSS'> digunakan untuk memanggil kode CSS yang telah disimpan/diupload ke server hostingan.<head>
<link href='sampleCSS.css' rel ='stylesheet' type='text/CSS'>
</head>
<body>
<p>Coba teks dengan Eksternal CSS</p>
</body>
</html>
Sepertinya, kalo kita lanjutin postingan yang ini, bakal jadi pangjang banget, karena masih ada banyak pelajaran CSS yang harus kita ketahui, seperti CSS ID, CSS class, dan lainnya. Maka, untuk memperpendek postnya, saya bagi postingan ini jadi sekitar dua atau tiga part. Mungkin pada part kedua akan saya posting minggu depan atau depannya lagi. So, tungguin post kami gan. hhe
Sekian dan Happy Blogging :))
posted by lintang @ 6:26 AM
0 Comments
0 Comments:
Post a Comment
Subscribe to Post Comments [Atom]
<< Home