Cara Mengelompokkan Selector Di CSS3

Hallo teman-teman DUMET School, pada tutorial kali ini saya akan menjelaskan cara mengelompokkan Selector di CSS3. Seperti yang kita ketahui biasanya kita hanya menargetkan salah satu class atau ID atau Tag untuk di berikan style, nah sebenernya kita bisa mengelompokkan mereka menjadi satu untuk di berikan style yang sama, jika memang beberapa elemen tersebut style nya sama, tapi kalau berbeda ya kita tetap menargetkan mereka satu-satu. Sifat pengelompokkan ini berlaku untuk semua Tag HTML, Class, dan ID. Dengan menggunakan pengelompokkan Selector ini kita dapat menghemat penulisan CSS dan dapat juga mempercepat loading website kita. Nah untuk mengelompokkan nya kita cukup menggunakan tanda koma. Baik kita akan coba langsung praktekkan saja ya.

Pertama saya akan buat 3 Tag Heading seperti gambar di bawah ini.

pengelompokkan selector CSS3

Kemudian CSS nya seperti gambar di bawah ini.

pengelompokkan selector CSS3

Bisa kalian lihat pada CSS di atas saya mengelompokkan tag h1, h2, dan h3 untuk saya berikan color warna biru dan pada selector h1 dan h3 saya kelompokkan untuk saya berikan style background-color dan padding. Pada contoh di atas kalian cukup menuliskan 1 selector saja maka semua tag Heading akan berubah warnanya menjadi biru.

See the Pen EjgZJY by Dumet_School (@dumet_school) on CodePen.

Nah itulah cara mengelompokkan selector di CSS3, sangat mudah bukan teman-teman, sekian dulu tutorial dari saya, semoga tutorial ini bermanfaat untuk teman-teman. Terima Kasih.

21 Mei 2015

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Mini Bootcamp Backend Laravel 11 Bulan Mei 2024 di DUMET School
Webinar Selanjutnya Mei 2024

Minggu, 26 Mei 2024, 09.00-13.00 WIB

(4 Jam Membuat Backend di Laravel 11)

chat