Як застосувати два класи CSS до одного елемента

Чи можу я застосувати 2 класи до одного div або span або будь-якого елемента html? Наприклад:

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

Я спробував, і в моєму випадку c2 не застосовується. Як я можу застосувати обидва класи одночасно?

1) Використовуйте кілька класів усередині атрибута класу, розділених пробілами ( ref ):

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

2) Для націлювання на елементи, що містять усі зазначені класи, використовуйте цей селектор CSS ( без пробілу ) ( ref ):

.c1.c2 {
}

Включіть обидва рядки класу в одне значення атрибута класу, з пробілом між ними.

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

Як зазначали інші, ви просто обмежуєте їх пробілом.

Однак знання того, як працюють селектори, також корисно.

Розгляньте цей шматок HTML ...

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

Використовуючи .a { ... }як селектор, ви виберете перший і третій. Однак, якщо ви хочете вибрати той, який має обидва aі b, ви можете скористатися селектором .a.b { ... }. Зверніть увагу, що це не буде працювати в IE6, він просто вибере .b(останній).

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

Це дуже ясно, що для додавання двох класів в єдиний div спочатку потрібно сформувати класи, а потім об’єднати їх. Цей процес використовується для внесення змін та зменшення значення “no”. класів. Ті, хто робить веб-сайт з нуля, в основному застосовували цей тип методів. вони складають два класи, перший клас - для кольорів, а другий - для встановлення ширини, висоти, стилю шрифту і т. д. Коли ми поєднуємо обидва класи, тоді діють перший і другий класи.

.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>

Відокремте їх пробілом.

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