Bagaimana menerapkan dua kelas CSS ke satu elemen

Bisakah saya menerapkan 2 kelas ke satu div atau span atau elemen html apa pun? Sebagai contoh:

<a class="c1" class="c2">aa</a>

Saya mencoba dan dalam kasus saya c2 tidak diterapkan. Bagaimana saya bisa menerapkan kedua kelas sekaligus?

1) Gunakan beberapa kelas di dalam atribut kelas, dipisahkan oleh spasi ( ref ):

<a class="c1 c2">aa</a>

2) Untuk menargetkan elemen yang berisi semua kelas yang ditentukan, gunakan pemilih CSS ini ( tanpa spasi ) ( ref ):

.c1.c2 {
}

Sertakan kedua string kelas dalam satu nilai atribut kelas, dengan spasi di antaranya.

<a class="c1 c2" > aa </a>

Seperti yang ditunjukkan orang lain, Anda cukup membatasinya dengan spasi.

Namun, mengetahui cara kerja penyeleksi juga berguna.

Pertimbangkan bagian HTML ini ...

<div class="a"></div>
<div class="b"></div>
<div class="a b"></div>

Menggunakan .a { ... }sebagai pemilih akan memilih yang pertama dan ketiga. Namun, jika Anda ingin memilih salah satu yang memiliki adan b, Anda dapat menggunakan selektor .a.b { ... }. Perhatikan bahwa ini tidak akan berfungsi di IE6, ini hanya akan memilih .b(yang terakhir).

<a class="c1 c2">aa</a>

Ini sangat jelas bahwa untuk menambahkan dua kelas dalam div tunggal, pertama-tama Anda harus membuat kelas-kelas tersebut lalu menggabungkannya. Proses ini digunakan untuk membuat perubahan dan mengurangi no. kelas. Mereka yang membuat situs web dari awal kebanyakan menggunakan metode jenis ini. mereka membuat dua kelas, kelas pertama untuk warna dan kelas kedua untuk pengaturan lebar, tinggi, gaya font, dll. Saat kita menggabungkan kedua kelas, kelas pertama dan kelas kedua keduanya berlaku.

.color
{background-color:#21B286;}
.box
{
  width:"100%";
  height:"100px";
  font-size: 16px;
  text-align:center;
  line-height:1.19em;
}
.box.color
{
width:"100%";
height:"100px";
font-size:16px;
color:#000000;
text-align:center;
}

<div class="box color">orderlist</div>

Pisahkan dengan spasi.

<div class="c1 c2"></div>