Apa itu CSS?
CSS merupakan singkatan dari "Cascading Style Sheets"
Dalam proses mendesain halaman, CSS bekerja dengan cara menggunakan penanda yang dikenal sebagai id dan class untuk mengakses elemen HTML yang ingin diubah. Seiring perkembangannya, CSS tidak hanya digunakan untuk HTML dan XHTML, tetapi juga sudah bisa dimanfaatkan untuk mendesain tampilan aplikasi android
Fungsi dan Kegunaan CSS
CSS memiliki banyak sekali fungsi untuk mengatur dan mempercantik halaman website. Beberapa kegunaan utamanya antara lain:
- Mengubah dan mengatur font, termasuk ukuran font, warna, dan formatnya
. - Mengatur tata letak (layout) halaman, seperti lebar, tinggi, dan warna elemen
. - Mengubah tampilan formulir (form)
. - Membuat halaman website agar menjadi responsif
. - Mengatur jarak di luar elemen menggunakan "margins"
. - Mengatur warna atau gambar latar belakang menggunakan "background"
. - Mengatur ukuran font secara spesifik menggunakan "font-size"
dan jenis font menggunakan "font-family" .
Cara Membuat CSS
Css memiliki format penulisan yang harus kita ikuti agar kode yang kita tulis dapat di eksekusi oleh browser dan diimplementasikan pada element html.
Format penulisan css ditunjukan pada gambar
berikut
Penjelasan:
1. Selector digunakan untuk
memilih element yang ingin kita atur propertinya, selector bisa
berupa tag element ataupun atribut element (berupa id, class dan lainya).
2. Properti adalah
variable-variable dari element yang bisa kita atur nilainya seperti color,
font, background, border, margin dan lain sebagainya.
3. Nilai
properti adalah nilai yang kita berikan pada properti tertentu.
4. Block style adalah satu
blok kode css untuk satu selector
Cara Menautkan Kode CSS
Untuk menggunakan CSS, ada beberapa langkah dasar yang perlu diketahui:
- Ekstensi File: File CSS disimpan dengan ekstensi .css
. - Menghubungkan ke HTML: File CSS ini kemudian diimpor atau dihubungkan ke dalam file HTML (atau PHP) yang ingin didesain
. - Menggunakan Tag
<link>: Proses penghubungan ini dilakukan menggunakan tag<link>. Tag ini diletakkan di dalam file HTML, tepatnya di bagian <head>.
Pada series berikutnya kita akan mempelajari cara menautkan CSS dengan lengkap.
Diskusi