Cascading Style Sheet atau yang lebih sering dikenal dengan sebutan css adalah text sederhana dengan ekstensi (.css) yang ditulis menurut aturan bahasa pemrograman yang merujuk rekomendasi dari CSS 1 dan CSS 2 dari W3C / World Wide Web yang merupakan badan gabungan dari pemilik web, universitas, perusahaan ( seperti Microsoft, Netscape, Apple, Opera, Mozilla dan Macromedia) dan tidak luput para ahli dalam bidang web.
Dengan css seorang programmer web akan lebih mudah dalam mengatur tampilan webnya. Salah satu keuntungan dari penggunaan css adalah kita bisa membuat ratusan bahkan ribuan halaman website dengan satu kali penulisan bahasa css. Kita hanya perlu menggunakan satu setting saja pada seluruh halaman website.
Keuntungan lainnya dalam penggunaan css adalah karena css sudah menjadi elemen penting dalam pembuatan web yang sesuai dengan teknologi Web 2.0 atau web modern yang sudah menjadi tren saat ini dan beberapa tahun mendatang. Dapat dikatakan bahwa css merupakan solusi tepat dalam membuat suatu web dengan cepat dan mudah.
Menurut rekomendasi dari W3C, untuk pembuatan suatu website kerangkanya perlu menggunakan HTML dan untuk design kita dituntut untuk menggunakan css. Dalam penulisan css sendiri ada beberapa aturan yang digunakan, pada css ada 2 komponen utama yang digunakan, yaitu selector dan declarator.
Selector {Declarator};
Selector merupakan tag dari sintax dalam html, contohnya <p>, <h1>, <b> dll. Sedangkan declarator adalah yang memberi perintah pada browser untuk membuat tampilan pada selector sesuai dengan perintah yang dideklarasikan pada declarator. Declarator sendiri terdiri dari 2 bagian, yaitu : property dan value
Sebagai contoh, biasanya saat kita akan membuat suatu artikel diawali dengan tag <p> bukan ? Nah jika kita ingin merubah font dari tag <p> tersebut kita gunakan script seperti dibawah ini :
p {font-family: verdana};
p merupakan selector, dan p ini akan merubah font dari kalimat yang berada pada file html yang berada diantara <p> dan </p>. font-family merupakan property untuk mengubah jenis font, sedangkan verdana merupakan value atau isi dari property yang kita gunakan, dalam kasus ini font dalam <p> akan berubah menjadi jenis verdana.
Selector ID dan Class
Selain selector yang bisa ditulis langsung dengan cara menyebutkan tag html-nya, kita juga bisa menggunakan cara lain, yaitu menggunakan id dan class. Fungsi dari selector id adalah untuk memberi tanda supaya pada tag html yang sudah diberi ID bisa diberi format lain. Sedangkan untuk selector class fungsinya sama dengan selector id namun pada selector class kita bisa memberi lebih dari satu selector class sedangkan pada selector id tidak bisa.
Bagaimana Cara Kerjanya ?
Untuk menggunakan css pada html, kita bisa menggunakan beberapa cara yang telah disediakan oleh html. Cara itu terbagi menjadi 3 yaitu :
- Inline Style
Inline Style adalah cara penulisan file css secara langsung kedalam tag html.
- Embedded Style
Merupakan cara penulisan css kedalam file html per halaman (page) dan penulisan file css sebelum tag </head>.
- Link Style
Link Style merupakan penulisan secara terpisah antara file html dan file css. Dan kita tinggal memasang link saja, pemasangan link css diletakkan di antara tag <head> ... </head>. Cara ini merupakan cara yang paling banyak digunakan oleh programmer web karena cara ini cukup satu kali penulisan file css yang nantinya akan dipakai oleh seluruh halaman website.
Komponen Property
CSS memiliki beberapa property, berikut adalah property-property yang dimiliki oleh css :
- Property Text Style
- Property Text Layout
- Property Border
- Property Margin
- Property Padding
- Property Page Layout
- Property Background
- Property Type Elemen
- Property Interface
Untuk membuat file css kita bisa menggunakan software Notepad, Notepad++, Dreamweaver, CoffeCup atau text editor yang lain.
Tags:
CSS
Terima Kasih Artikel-nya bang.Dalam CSS bagusan menggunakan Declator atau Selector ID dan Class. Terus Posting terus ya gan... Oh ya, Pernekalkan nama saya Muhamad Asfarezhan NIM 1922500056, Saya Mahasiswa dari kampus STMIK ATMA LUHUR pangkalpinang. Bila ingin liat - liat tentang kampus ku silahkan kunjungin https://www.atmaluhur.ac.id
BalasHapusTerima Kasih
sama2 mas :)
BalasHapus