Как получить фоновый цвет div красного цвета?

Question

У меня есть эти дивы с тем же классами и тем же дизайн CSS, содержащих картинами

<div class="it2" style="background: url(../images/ian.png) no-repeat top center;"></div> 

<div class="it2" style="background: url(../images/top.png) no-repeat top center;"></div> 

<div class="it2" style="background: url(../images/ylle.png) no-repeat top center;"></div> 

, что я пытался сделать, когда я зависать на одном из дивы фон становится красным, не покрывая картину

любая возможная идея?

Я попробовал, добавив в CSS:

.it2:hover { background-color:red;} 

, но он не работает

Answer 1

Я предполагающее опечатку в коде Snippit только в проводке, а не в реальном коде?

Предполагая, что ваш фактический css-файл имеет «background-color» вместо «hacground-color» в качестве имени свойства, является ли ваш CSS встроенным или является частью отдельной таблицы стилей? Inline CSS всегда будет чрезмерно управлять таблицей стилей (что является одним из преимуществ использования всего в таблице стилей - больше возможностей для работы с ними, когда должны произойти изменения.

Имеет ли ваш png прозрачность и вы используете браузер, который поддерживает это? Если нет, цвет фона будет за изображение, и, следовательно, вы не увидите изменения.

Если ваш сайт должен работать в браузерах, которые не отображают прозрачность должным образом, вы можете необходимо использовать два фоновых изображения (единственное отличие - цвет фона изображения) и использовать CSS для переключения между ними.

Answer 2

попробуйте следующее:

.it2:hover 
{ 
    background:url() no-repeat top center; 
    background-color:red; 
}