Mix Blend Mode для текста и изображений - PullRequest
Новая
       72

Mix Blend Mode для текста и изображений

0 голосов
/ 04 февраля 2020

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

    <div id="fullpage">
    <div class="section" id="one">
        <p class="name">Tyler Owens</p> <p class="info">Graphic Design</p> 
    </div>

    <div class="section" id="two">
        <div class="scrollable-content">
            <div class="header">
            <p class="name1">Tyler Owens</p> 
            <p class="information">Information</p> 
            <p class="work" >Non-Work</p> 
            <p class="work1" >Work</p> 
            </div>
            <div class=grid2>
            <img class="artekbook1" src="img/artek_book.png" alt=""> 
            <img class="programbook1" src="img/programbook2.png" alt="">
            <img class="postershow" src="img/postershow.png" alt="">
            </div>
            </div>
        </div>
    </div>

В настоящее время я вызываю режим смешивания: разность; на сетке2

скриншот результата

спасибо за любую помощь

1 Ответ

0 голосов
/ 04 февраля 2020

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

Попробуйте применить режим смешивания для .header вместо .grid2, чтобы смешать ваши надписи с изображением под ними.

...