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

Пользователь

от ian.heidenreich , в категории: HTML/CSS , 3 года назад

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

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от emanuel_boyer , 3 года назад

@ian.heidenreich  Сделать прозрачный текст в CSS, можно через свойство opacity или прописав прозрачный текста color:


HTML:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
<html>
<head>
    <meta charset="utf-8"/>
    <style>
        .wrapper h1 {
            opacity: 0;
            /* OR */
            /*color: rgba(0, 0, 0, 0)*/
        }
    </style>
</head>
<body>
    <div class="wrapper">
        <h1>Всем Приветик!</h1>
    </div>
</body>
</html>


Пользователь

от cheyenne.boehm , 3 года назад

@ian.heidenreich  Прозрачный текст в CSS, можно через свойство opacity, но в этом случаи он становится полностью невидимый, а если нужно, чтобы текст был виден, но остался прозрачным можно через свойство mix-blend-mode:


HTML:

1
2
3
4
5
<body>
    <div class="wrapper">
        <h1>Всем Приветик!</h1>
    </div>
  </body>


CSS:

1
2
3
4
5
6
7
.wrapper{
    background-image: url(image/56666.jpeg);
}
h1{
    mix-blend-mode:overlay;
    text-align: center;
}