Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS | |
5.0 | 7.0 + | 1.0 + | 3.5 + | 1.0 + | 1.0 + | 1.0 + | 1.0 + |
Версії CSS
CSS 1 | CSS 2 | CSS 2.1 | CSS 3 |
---|---|---|---|
Опис
До будь-якого тегу одночасно можна додати кілька класів, перераховуючи їх в атрибуті class через пробіл. В цьому випадку до елементу застосовується стиль, описаний в правилах для кожного класу. Оскільки при додаванні декількох класів вони можуть містити однакові стильові властивості, але з різними значеннями, то береться значення у класу, який описаний в коді нижче.
Синтаксис
<E class="class1 class2 ...">
Тут E — позначає будь-який тег.
В стилях допустимо використовувати запис наступного вигляду.
. Class1.class2 {Опис правил стилю}
В такому випадку стиль застосовується тільки для елементів, у яких одночасно задані класи class1 і class2, т. е. в коді HTML використовується конструкція <E class="class1 class2> .
Приклад
HTML5 CSS 2.1 IE Cr Op Sa Fx
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> Мультикласи </title> <style> .level1 {font-size: 1em; } .level2 {font-size: 1.2em; } .level3 {font-size: 1.4em; } .level4 {font-size: 1.6em; } .level5 {font-size: 1.8em; } .level6 {font-size: 2em; } a.tag {color: #468be1; /* Колір посилань */ } </style> </head> <body> <div> <a href="/term/2" class="tag level6"> Paint.NET</a> <a href="/term/69" class="tag level6"> Photoshop</a> <a href="/term/3" class="tag level5"> колір</a> <a href="/term/95" class="tag level5"> фон</a> <a href="/term/11" class="tag level4"> палітра</a> <a href="/term/43" class="tag level3"> шари</a> <a href="/term/97" class="tag level2"> світло</a> <a href="/term/44" class="tag level2"> панелі</a> <a href="/term/16" class="tag level1"> лінія</a> <a href="/term/33" class="tag level1"> прямокутник</a> <a href="/term/14" class="tag level1"> піксель</a> <a href="/term/27" class="tag level1"> градієнт</a> </div> </body> </html>
Результат даного прикладу показаний на рис. 1.
Браузери
Браузер IE до версії 7.0 некоректно працює з мультикласами і розуміє запис .ab як .b, тобто сприймає тільки ім'я останнього класу, що призводить до помилок.