Как убрать прозрачность текста в прозрачном div?

Question

[Владимир Голубь]

Есть такой код

<section class="menu">
		<div class="container">
			<div class="row">
				<ul class="menu--list clearfix">
					<li class="active"><a href="">О компании</a></li>
					<li><a href="">Услуги</a></li>
					<li><a href="">Наши преимущества</a></li>
					<li><a href="">Как мы работаем</a></li>
					<li><a href="">Наши работы</a></li>
					<li><a href="">Отзывы</a></li>
				</ul>
			</div>
		</div>
	</section>

Для .menu задаю прозрачность 0.2. Как убрать ее для вложенный элементов ? Установка для них значения 1 не помогает, они наследуют родителя. Нужно сделать, чтобы блок с меню был прозрачным, а ссылки и так далее нет.

Answer 1

[Ankhena]

1. Прозрачность в одном блоке, текст в другом и наложить один на другой.
2. Если речь об однородном фоне, использовать цвет в rgba вместо opacity.

Answer 2

[Даниил Вершинин]

Opacity дает полупрозрачность всему блоку, а не его фону.
Для того, чтобы сделать полупрозрачным только фон, используйте
bacground: rgba( r,g,b,0.2);

Answer 3

[Андрей Токмаков]

Для вложенных ни как, внутри прозрачного блока всё становится прозрачным и ни чего с этим не сделаешь. Остается только выноситься всё из этого блока и абсолютно позиционировать. Ну или же как написал Ankhena W использовать rgba цвета, вместо прозрачности

Comments

[Ankhena]

да и первая часть вашего ответа мало отличается от того, что я написала

[Андрей Токмаков]

Ankhena W: я и не говорил что она отличается, просто по другому расписал

Answer 4

[rhost]

Если блок имеет какой-то цвет, может лучше использовать rgba() ?

Answer 5

[Дмитрий Воробьев]

.menu {
background: rgba( 255, 255, 255, 0.2);
};