Как написать CSS для фона

Question

У меня есть прозрачный логотип, для которого я хочу применить цвет фона. Как я могу это сделать, используя css?

Answer 1

Просто используйте background-color для вашего элемента как такового:

<img style="background-color: #F00;" src="my_transparent_logo.png" />

---

Если вы не хотите делать это в строке, вы можете назначить ему идентификатор (или класс), например:

<img id="logo" src="my_transparent_logo.png" />

и в вашем внешнем файле CSS сделайте следующее:

#logo {
  background-color: #F00;
}

Answer 2

Вы можете использовать

background-color

См. Свойства фона

Answer 3

Вот еще один ресурс для применения свойств фона через css: http://www.w3schools.com/css/css_background.asp

Хотя я подумал, что если вы хотите, чтобы изображение имело цвет фона, это может отменить цель использования .png, поэтому может быть лучше преобразовать .png в .jpg с добавлением цвета фона в само изображение. Тогда вам не нужно беспокоиться о совместимости браузера с прозрачностью - грубо говоря, это зависит только от вашей цели.

Answer 4

Предполагая элемент с атрибутом id с уникальным значением "logo",

#logo { background-image: url("foo"); background-color: #F00; }