У меня есть тег <div>, который я написал в стиле opacity: 0.5;. Внутри этого тега <div> у меня есть , что я не хочу иметь непрозрачность 50%. Мне интересно, есть ли способ стилизовать элемент <div> и исключить элемент , который находится внутри элемента <div>.Стиль непрозрачности элемента без стиля Детский элемент
Непрозрачность не унаследована, а потому, что у родителя есть непрозрачность, которая распространяется на все, что внутри него. Вы не можете сделать дочерний элемент менее прозрачным, чем родительский. Итак:
opacity для дочерних элементов, за исключением iframe.rgba или прозрачный png.jsFiddle, демонстрирующий упомянутую выше rgba. http://jsfiddle.net/z85fgupu/ Обратите внимание, что черный фон является 0,5 непрозрачностью из-за установки a или альфа rgba() –
Итак, как добавить тот же цвет фона (с непрозрачностью 50%), поскольку другие элементы iframe (у него есть граница)? EDIT: Не понял, если я использую rgba, это не влияет на iframe? –
http://jsfiddle.net/z85fgupu/ –
Как @ROX заявлено, вы не можете. По-моему, выбор непрозрачности для других дочерних элементов может быть хорошим выбором. Попробуйте это:
.your_div *:not(iframe) {
opacity: 0.5;
}
Другим вариантом будет использовать обертку с relative положением и всех других элементов с absolute позиции внутри этой оболочки. JSFiddle
Это, похоже, не работает для меня, я попробовал это раньше, но спасибо! –
@SethTaddiken Я добавил еще один вариант, см. Его –
Спасибо, это сработало бы, но лично я предпочел бы использовать значение rgba в качестве фона. –
Почему вы хотите, чтобы 'непрозрачность' была' 0,5'? задний план? Решение задает непрозрачность дочерних элементов, за исключением 'iframe'. – dashtinejad
Возможный дубликат [Установить непрозрачность фонового изображения без влияния на дочерние элементы] (http://stackoverflow.com/questions/4997493/set-opacity-of-background-image-without-affecting-child-elements) – 2014-08-31 05:58:31