Тонирование фонового изображения с помощью linear-gradient не работает

Я пытаюсь подкрасить изображение прозрачным линейным градиентом. Инструменты разработчика говорят, что моя собственность недействительна. Если я избавлюсь от градиента, изображение будет отображаться нормально. Что-то мне не хватает?

body {
    background: linear-gradient (rgba(255,0,0,0.45),rgba(255,0,0,0.45)),
                url('Fabric-4.png');
    font-family: 'Oswald', sans-serif;
    font-size: large;
}

css background-image linear-gradients
person ernestson    schedule 26.03.2015    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Вам нужно использовать префикс для разных браузеров при использовании свойства css gradient, проверьте этот код.

body { 
  background: -webkit-linear-gradient(rgba(255,0,0,0.45), rgba(255,0,0,0.45));
  font-family: 'Oswald', sans-serif;
  font-size: large;
}
person stanze    schedule 26.03.2015
comment
да, это не сработало ... с хромом вам не нужны префиксы поставщиков ... хотя спасибо за попытку - person ernestson; 26.03.2015

arrow_upward
0
arrow_downward

Это просто потому, что ваша разметка не работает. У вас слишком много места. Удалите пробел между linear-gradient и (, и вы увидите, что проблема отсортирована. Я добавил рабочий код ниже и пометил его по своему усмотрению.

Вот ручка с рабочим примером (и другим изображением). Попробуйте добавить пространство живет в ручке и видит, как все снова исчезает. :)

body {
    background: 
        linear-gradient(
            rgba(255,0,0,0.45),
            rgba(255,0,0,0.45)),
            url('Fabric-4.png');
    font-family: 'Oswald', sans-serif;
    font-size: large;
}
person Matias Vad    schedule 02.04.2015