Rasanya Kurang Nyaman Kalau belum Buat Trit di Blog baru ini iiihihii
binggung mau share apa ... tapi tenang kok .. sekarang saya mau Share tentang Dasar Dasar CSS
silahkan putar lagu-lagu kesayangan anda dan mari belajar dengan santai :D
Syntax CSS
Apa itu Syntax CSS? Syntax CSS adalah perintah-perintah yang digunakan untuk mengatur
tampilan dokumen HTML. Syntax CSS terdiri dari: Selector, Property, dan Value.
Contoh penulisan syntax CSS adalah sebagai berikut:
selector { property: value }
Apa itu Selector?
Selector adalah perintah yang menunjukan bagian mana yang ingin diformat.
Apa itu Property dan Value?
Property adalah attribute dari selector. Sedangkan Value adalah “Nilai” dari Property.
Contoh Syntax:
h1 { color: red }
Penjelasan:
Pengelompokan Selector
Jika anda ingin mengatur lebih dari satu selector, maka selector tersebut harus dikelompokan
dengan dipisahkan oleh tanda koma “,” . Contohnya jika kita ingin mengatur element <h1>, <h2>,
dan <h3> menjadi berwarna merah semua, maka syntax penulisannya akan menjadi seperti ini:
Contoh:
h1, h2, h3 { color: red }
Penggunaan Banyak Property
Jika anda ingin menggunakan lebih dari satu property, maka gunakanlah tanda titik koma “;” untuk
memisahkannya.
Contoh:
h1 { color: red;font-family: arial;font-size: 12px }
Penjelasan:
Syntax css diatas akan memformat element HTML <h1> menjadi huruf arial, berukuran 12 pixel,
dan huruf tersebut berwarna merah.
Cara Penulisan Syntax Yang Baik
Dalam penulisan Syntax CSS, Sangat disarankan untukmenggunakan beberapa baris baru dalam
mengatur property dan value
Contohnya:
h1 {
color: red;
font-family: arial;
font-size: 12px
}
Contoh diatas sama halnya dengan syntax:
h1 { color: red; font-family: arial; font-size: 12px }
Lebih enak melihat yang mana? Tentu yang menggunakan beberapa baris baru bukan? :D
Komentar Pada CSS
Seperti halnya komentar pada HTML, CSS juga memiliki syntax yang mendefinisikan dirinya sebagai
komentar (pengingat). Komentar pada CSS didefinisikan menggunakan syntax /*dan */
(Dibuka dengan slash bintang, dan ditutup dengan bintang slash).
Ingat! Yang namanya komentar tidak akan dibaca sebagai “code” oleh browser, tapi hanya dibaca
sebagai text pengingat. Dan tentunya komentar tersebut tidak akan ditampilkan oleh browser.
Contoh penggunaan komentar CSS:
/* ini adalah syntax css untuk element h1 */
h1{
font-family: arial;
color: red;
}
Oke, karena kita sudah mempelajari dasar-dasar CSS,maka pada pembahasan selanjutnya kita
akan belajar mengimplementasikan CSS pada suatu dokumen HTML. Are you ready?
binggung mau share apa ... tapi tenang kok .. sekarang saya mau Share tentang Dasar Dasar CSS
silahkan putar lagu-lagu kesayangan anda dan mari belajar dengan santai :D
Syntax CSS
Apa itu Syntax CSS? Syntax CSS adalah perintah-perintah yang digunakan untuk mengatur
tampilan dokumen HTML. Syntax CSS terdiri dari: Selector, Property, dan Value.
Contoh penulisan syntax CSS adalah sebagai berikut:
selector { property: value }
Apa itu Selector?
Selector adalah perintah yang menunjukan bagian mana yang ingin diformat.
Apa itu Property dan Value?
Property adalah attribute dari selector. Sedangkan Value adalah “Nilai” dari Property.
Contoh Syntax:
h1 { color: red }
Penjelasan:
- h1 = Selector
- color = Property
- red = Value
Pengelompokan Selector
Jika anda ingin mengatur lebih dari satu selector, maka selector tersebut harus dikelompokan
dengan dipisahkan oleh tanda koma “,” . Contohnya jika kita ingin mengatur element <h1>, <h2>,
dan <h3> menjadi berwarna merah semua, maka syntax penulisannya akan menjadi seperti ini:
Contoh:
h1, h2, h3 { color: red }
Penggunaan Banyak Property
Jika anda ingin menggunakan lebih dari satu property, maka gunakanlah tanda titik koma “;” untuk
memisahkannya.
Contoh:
h1 { color: red;font-family: arial;font-size: 12px }
Penjelasan:
Syntax css diatas akan memformat element HTML <h1> menjadi huruf arial, berukuran 12 pixel,
dan huruf tersebut berwarna merah.
Cara Penulisan Syntax Yang Baik
Dalam penulisan Syntax CSS, Sangat disarankan untukmenggunakan beberapa baris baru dalam
mengatur property dan value
Contohnya:
h1 {
color: red;
font-family: arial;
font-size: 12px
}
Contoh diatas sama halnya dengan syntax:
h1 { color: red; font-family: arial; font-size: 12px }
Lebih enak melihat yang mana? Tentu yang menggunakan beberapa baris baru bukan? :D
Komentar Pada CSS
Seperti halnya komentar pada HTML, CSS juga memiliki syntax yang mendefinisikan dirinya sebagai
komentar (pengingat). Komentar pada CSS didefinisikan menggunakan syntax /*dan */
(Dibuka dengan slash bintang, dan ditutup dengan bintang slash).
Ingat! Yang namanya komentar tidak akan dibaca sebagai “code” oleh browser, tapi hanya dibaca
sebagai text pengingat. Dan tentunya komentar tersebut tidak akan ditampilkan oleh browser.
Contoh penggunaan komentar CSS:
/* ini adalah syntax css untuk element h1 */
h1{
font-family: arial;
color: red;
}
Oke, karena kita sudah mempelajari dasar-dasar CSS,maka pada pembahasan selanjutnya kita
akan belajar mengimplementasikan CSS pada suatu dokumen HTML. Are you ready?