Bonjour à tous,

j'aimerais savoir s'il est possible de rendre un texte transparent pour qu'on voit l'image de fond uniquement au travers de ce texte ?
Dans le code ci-dessous j'ai mis l'image de fond dans le .cont, et par dessus le .lettres qui devrait normalement avoir un fond noir. Le but recherché est que tout doit être noir, sauf le texte qui doit laisser voir l'image de fond par transparence.
Dans l'état actuel, si je mets color:transparent; dans la classe .lettres, le texte disparait, puisqu'il laisse apparaitre le fond noir par transparence.
En question subsidiaire, est-il possible de rendre transparent, autre chose que du texte. Un cercle au milieu du .lettres par exemple?
Par avance merci
fifi
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>texte transparentes</title>
    <link rel="stylesheet" href="style.css">
</head>
 
<body>
    <div class="cont">
        <div class="lettres">
            Lorem ipsum dolor sit amet
        </div>
    </div>
</body>
</html>

CSS :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
* {
    margin: 0;
    padding: :0;
}
 
body {
    background-color: antiquewhite;
}
 
.cont {
    width: 750px;
    height: 280px;
    background-color: greenyellow;
    background-image: url(https://www.atlasseo.fr/images/agence-seo/blog/holi-festival-india_750x280.jpg);
    overflow: hidden;
}
 
.lettres {
    width: 100%;
    height: 100%;
    font-size: 8em;
    font-weight: bold;
    text-align: center;
    color: aqua;
    /*background-color: black;*/
}