Непрозрачность цели только целевого изображения?

У меня есть этот CSSНепрозрачность цели только целевого изображения?

.jumbotron { 
    background: url('/background.svg'); 
    opacity: 0.5; 
}

, но я хочу непрозрачности целевой только фоновое изображение. В настоящий момент он нацелен на весь jumbotron, так что шрифты и т. Д. Также исчезли.

Я попытался

.jumbotron { 
    background: url('/background.svg'); 
    background: opacity: 0.5; 
}

.jumbotron { 
    background: url('/background.svg'); 
} 
.jumbotron:img { 
    opacity: 0.5; 
}

но ни работы.

источник

2015-10-01 Jack

Смотрите этот Http: // StackOverflow .com/вопросы/4183948/css-set-background-image-with-opacity и http://stackoverflow.com/questions/4997493/set-opacity-of-background-image-without-affecting-child-elements –

Вы необходимо установить фон как псевдоэлемент (': before' /': after') и использовать непрозрачность только для этого псевдоэлемента - Not e, вы можете установить 'z-index: -1;' на этот псевдоэлемент –

Извините, я не понимаю. Что получает: до или: после? ... Мой текущий код - это первый пример, что мне нужно сделать? – Jack

От CSS-tricks.com:

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

.jumbotron::after { 
    content: ""; 
    background: url(/background.svg); 
    opacity: 0.5; 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 0; 
    position: absolute; 
    z-index: -1; 
}

Как Ишервудом упоминалось в комментариях, может быть, вы должны установить

.jumbotron { 
    position: relative; 
}

источник

2015-10-01 12:03:47 Wavemaster

@Wavemaster, который заставляет всю страницу иметь фон background.svg, а не jumbotron – Jack

Возможно, вам сначала понадобится '.jumbotron {position: relative}' first. – isherwood

-1

Непрозрачность: 1 для anoter элемента в JumboTron как шрифт и т.д.

источник

2015-10-01 12:11:27

Это не сработает, потому что общая непрозрачность уже установлена на 0,5. – Wavemaster

Непрозрачность цели только целевого изображения?

ответ

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