Bismillahirrohmaanirrohiiim...
sekedar mengingat kembali tentang dasar CSS :)
CSS (Cascading Style Sheets) sudah menjadi hal yang sering didengar oleh MP-ers. yang saya tau, CSS di tuliskan dengan beberapa cara berbeda (insyaAlloh ada 3 cara) antara lain sbb :
cara 1 :
contoh kode:
<div style='padding: 0 0 10px 0; min-height: 20px;' id='user_welcome_message'></div>
penjelasan:
perhatikan kode yang diwarnai merah, pada contoh diatas CSS di deklarasikan langsung di dalam tag
div dengan menuliskannya diantara tanda single quote (') atau double quote (").
cara ini dirasa agak ribet karena harus menuliskan perintah CSS satu per satu untuk setiap tag yang ingin di custom (weleeehhhh...kebayang gimana ribetnya kalo pengen bikin website gede)
kekurangan:
pseudo-element dan
pseudo-class tidak dapat diperintah melalui cara ini, karena mereka hanya muncul pada kondisi tertentu.
cara 2 :
contoh kode:
<html>
<head>
<style type="text/css">
h1 {
color:red;
}
p {
color:blue;
}
</style>
</head>
<body>
<h1>Header 1</h1>
<p>A paragraph.</p>
</body>
</html>
penjelasan:
perhatikan kode yang diwarnai merah, pada contoh diatas CSS di deklarasikan dalam tag
style. menurut saya, cara ini lebih ringkas dari cara pertama karena perintah CSS untuk semua tag dalam halaman html diatas dapat diakomodir dengan menuliskannya diantara tanda
<style type="text/css"> dan tanda
</style>. perintah-perintah yang ditulis diantara tag diatas dapat menjangkau hampir setiap elemen pada halaman dimaksud termasuk
pseudo-element dan
pseudo-class.
cara 3 :
contoh kode:
<head>
<link rel="stylesheet" type="text/css" href="http://multiply.com/style/custom/redfrog/38.css">
</head>
penjelasan:
pada contoh diatas saya mengambil sebagian dari source-code
multiply.com. css tipe ini dituliskan didalam tag
link dan di simpan pada file yang berbeda dari halaman html. pada contoh diatas file css disimpan pada link
http://multiply.com/style/custom/redfrog/38.css. penulisan css dengan cara ini saya anggap paling ringkas dan lebih memudahkan. ketika web editor ingin mengubah kode css dari halaman yang diinginkan tinggal mengubah file css yang sudah disimpan terpisah dengan file html.
alhamdulillah...selesaiii..semoga berguna :)
nb: kalo kurang tolong ditambahin yah :D
..................................bersambung ke postingan berikutnya.....................................
credits :
http://w3schools.comhttp://multiply.com
