Class Selector CSS

Di HTML, nilai atribut CLASS merupakan pengenal yang boleh dimiliki oleh lebih dari satu elemen. Tidak seperti nilai atribut ID, satu halaman dokumen yang ada tidak diperbolehkan memiliki dua nilai yang sama.

Di CSS, berdasarkan itu, memungkinkan anda memberikan aturan CSS menggunakan Class selector.

Penulisan Class selector:

• Awali dengan titik (.), lalu nama class-nya.

  Contoh kode di bawah akan memberikan dampak aturan CSS kepada semua elemen ber-CLASS 'myClass':

  .myClass { /*di sini kode-kode css*/ }
• Awali dengan nama elemen, kemudian titik (.), lalu nama class-nya.

  Contoh kode di bawah akan memberikan dampak aturan CSS kepada semua elemen P ber-CLASS 'myClass':

  P.myClass { /*di sini kode-kode css*/ }

Kedua bentuk penulisan di atas sama saja, tetapi bentuk kedua lebih spesifik.

Contoh kode di bawah akan memberikan dampaknya kepada semua elemen P ber-CLASS 'lorem':

P.lorem { color: red; text-align: center; }

Dan banyaknya elemen P ber-CLASS 'lorem' itu mungkin seperti berikut:

<P CLASS="lorem">Lorem ipsum....1</P> <P CLASS="lorem">Lorem ipsum....2</P> <P CLASS="lorem">Lorem ipsum....3</P>

Contoh kode di bawah akan memberikan dampaknya kepada semua elemen ber-CLASS 'lorem':

.lorem { color: red; font-weight: bold; }

Dan banyaknya elemen ber-CLASS 'lorem' itu mungkin seperti berikut:

<P>Lorem <SPAN CLASS="lorem">ipsum</SPAN>....1</P> <P>Lorem <U CLASS="lorem">ipsum</U>....2</P> <P>Lorem <S CLASS="lorem">ipsum</S>....3</P>

Silahkan lihat juga Id Selector CSS.