2016-01-26 3 views
1

У меня есть этот код на моей странице:CSS цвет фона класса не работает

.0 { 
 
    background-color: blue; 
 
} 
 
.1 { 
 
    background-color: red; 
 
}
<div class="1">Ma ligne</div> 
 
<div class="0">Ma ligne</div> 
 
<div class="1">Ma ligne</div> 
 
<div class="0">Ma ligne</div> 
 
<div class="1">Ma ligne</div> 
 
<div class="0">Ma ligne</div> 
 
<div class="1">Ma ligne</div>

Я хотел бы, чтобы установить фоновый цвет меняется, если класс 0 или 1. Но ничего не меняется. Я что-то пропустил (очевидно)?

CSS загружен, другие элементы страницы правильно установлены с использованием стиля CSS.

+6

Занятия не начинаются с цифр. – j08691

+2

Посмотрите на псевдо-селекторы ': nth-child (even)' и ': nth-child (odd). –

+0

@ j08691, технически, это неверно. Начиная с HTML5, классы (и id) могут начинаться с чего угодно. http://stackoverflow.com/a/31773673/3597276 ... Практически, однако, браузеры могут быть не готовы к этому. –

ответ

2

В настоящее время идентификаторы, такие как имена классов, не могут начинаться с цифр. Надеюсь, это изменится в будущем, так как браузеры полностью перейдут на реализацию спецификации HTML5, но, к сожалению, этого еще не произошло.

Эти правила распространены на большинстве языков, и в этом случае CSS. Here's a full spec of identifier rules, которые являются общими для языков за пределами HTML/CSS.

Замените каждый класс примерно на .b0, .b1 и т. Д., И он будет работать.

+0

Как я уже упоминал в своем комментарии выше, это неверно. http://stackoverflow.com/a/31773673/3597276 –

+0

@Michael_B Учитывая, что ни один браузер не реализует эту часть спецификации, это не помогает ответить на вопрос. – Scott

+0

Я думаю, что вы могли бы эффективно ответить на вопрос, не делая абсолютного утверждения: * Идентификаторы, такие как имена классов, не могут начинаться с цифр. *, Что больше не верно. Как я уже упоминал в другом комментарии, начиная с HTML5, значения класса могут начинаться с чисел. Однако некоторые браузеры все еще могут придерживаться правил HTML4. –

0

Попробуйте это:

<div class="zero">Ma ligne</div> 

     <div class="first">Ma ligne</div> 

     <div class="zero">Ma ligne</div> 

     <div class="first">Ma ligne</div> 

     <div class="zero">Ma ligne</div> 

     <div class="first">Ma ligne</div> 

и CSS

.zero { 
    background-color: blue; 

} 

.first { 
    background-color: red; 
} 
0

Вы не можете объявить число как класс CSS. Однако вы можете сделать что-то вроде class="_1"

Смежные вопросы