Fungsi CSS
1. Membuat Tampilan Menarik:
CSS digunakan untuk menata warna, font, margin, padding, layout, dan elemen visual lainnya.
2. Memisahkan Konten dan Desain:
Memisahkan struktur HTML dari desain, sehingga konten lebih mudah dikelola dan diperbarui.
3. Mengurangi Pengulangan Kode:
Satu file CSS dapat digunakan untuk banyak halaman, sehingga efisien dalam pengelolaan desain.
4. Meningkatkan Konsistensi Desain:
Dengan menggunakan CSS, semua halaman web dapat memiliki desain yang seragam.
5. Mendukung Responsivitas:
Membantu membuat desain yang ramah untuk berbagai perangkat (desktop, tablet, ponsel).
Macam-Macam CSS
CSS terdiri dari beberapa jenis berdasarkan cara penerapannya:
1. Inline CSS:
CSS ditulis langsung di dalam elemen HTML menggunakan atribut style.
Contoh :
2. Internal CSS:
Ditulis dalam elemen <style> di bagian <head> dari dokumen HTML.
Contoh :
Disimpan di file terpisah dengan ekstensi .css dan dihubungkan ke file HTML menggunakan tag <link>.
Contoh :
HTML :
Code Css :
Hasil :
Comment CSS
Comment CSS adalah catatan atau teks yang ditambahkan ke dalam kode CSS untuk memberikan penjelasan, tetapi tidak dieksekusi oleh browser. Comment CSS membantu pengembang memahami, mendokumentasikan, dan mengelola kode dengan lebih mudah. comment bisa diketik secara manual atau bisa saja dengan shortcut ctrl + /.
Contoh :
ID di CSS
ID dalam CSS adalah salah satu cara untuk memberikan gaya khusus pada elemen HTML tertentu. id adalah atribut unik yang digunakan untuk mengidentifikasi elemen tunggal di halaman web. Setiap id hanya boleh digunakan sekali per halaman, sehingga id ideal untuk menargetkan elemen tertentu dengan presisi. id dilambangkan dengan simbol # dalam css.
Contoh :
Multiple Class di CSS
Multiple Class CSS adalah teknik di mana sebuah elemen HTML dapat memiliki lebih dari satu class yang diterapkan secara bersamaan. Ini memungkinkan Anda untuk menggabungkan beberapa gaya yang berbeda pada elemen yang sama, sehingga mempermudah penulisan dan pengelolaan kode CSS.
Contoh :
Universal Selector
Universal Selector dalam CSS adalah selector yang digunakan untuk memilih semua elemen pada halaman web. Ini diwakili dengan tanda bintang (*). Selector ini sangat berguna jika Anda ingin menerapkan gaya (style) ke semua elemen HTML tanpa memandang jenisnya.
Contoh :
Group Selector CSS
Group Selector dalam CSS digunakan untuk menerapkan gaya yang sama pada beberapa elemen HTML yang berbeda secara bersamaan. Dengan menggunakan grup selector, Anda dapat menulis satu aturan CSS yang berlaku untuk beberapa elemen, yang akan menghemat kode dan memudahkan pemeliharaan.
Contoh :
Color di CSS
Color dalam CSS adalah properti yang digunakan untuk menentukan warna teks pada elemen HTML. Properti ini memungkinkan Anda untuk mengubah warna teks agar sesuai dengan desain halaman web.
color di css ada bebarapa macam, yaitu bisa disebutkan langsung warnanya, lalu dengan hexacode, HSL, RGB, dan RGBA
Contoh :
Komentar
Posting Komentar