Как сделать прозрачный фон, но не текст

Question

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

Как надо:

... и как у меня:

.info {
  opacity: 0.9;
  background-color: #39312b;
}

.info-text h2 {
  font-family: 'Noto Sans', arial;
  font-size: 48px;
  line-height: 56px;
  font-weight: 400;
  text-transform: uppercase;
  color: #f0f0f0;
}

.info-text p {
  font-family: 'Noto Sans', arial;
  font-size: 26px;
  line-height: 56px;
  font-weight: 400;
  text-transform: uppercase;
  color: #f0f0f0;
}

<div class="info">
  <div class="info-text">
    <h2>Декоративные покрытия</h2>
    <p>от лучших производителей</p>
  </div>
</div>

Answer 1

CSS RGB Colors

.info {
  opacity: 0.9;
  background-color: rgba(57, 49, 43, .5);
}

.info-text h2 {
  font-family: 'Noto Sans', arial;
  font-size: 48px;
  line-height: 56px;
  font-weight: 400;
  text-transform: uppercase;
  color: #f0f0f0;
}

.info-text p {
  font-family: 'Noto Sans', arial;
  font-size: 26px;
  line-height: 56px;
  font-weight: 400;
  text-transform: uppercase;
  color: #f0f0f0;
}

<div class="info">
  <div class="info-text">
    <h2>Декоративные покрытия</h2>
    <p>от лучших производителей</p>
  </div>
</div>

БЛОГ НА HUSL

Как сделать прозрачный фон, но не текст

Ответы (1 шт):