Текст прозрачность над непрозрачностью CSS ⇐ Html

[Anonymous]

Как я могу достичь такого рода макета?
был фон, затем другой контейнер с непрозрачностью
, затем текст прозрачен. работа. Я использовал, чтобы обрезать текст на фон, это то, что он выглядит, но подход неверен.

my html:


stack overflow


< /code>
Вот мой текущий sass: < /p>
.sec_about
{
margin-top: 80px;
background-color:white;
height:450px;
opacity: 0.65;
filter: alpha(opacity=65); /* For IE8 and earlier */
h1
{
background: url('../img/bg1.jpg') no-repeat;

// text-rendering: optimizeLegibility;
text-transform: uppercase;
font-size: 65px;
font-weight: bold;
font-family: $roboto_bold;
text-align: center;
z-index: 2;
white-space: nowrap;
margin-top: 30px;
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
}

}


Подробнее здесь: https://stackoverflow.com/questions/404 ... pacity-css