J'ai ajouté une image d'arrière-plan à mon élément html en css pour qu'il s'étende avec la taille du navigateur web. J'ai changé l'opacité de cet élément html en 0,5. Je souhaite que les éléments enfants (notamment les éléments h1 et paragraphe) retrouvent une opacité de 1 afin que le texte ne soit pas transparent. Cela ne fonctionne pas. Merci de m'aider :)
HTML :
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<link rel = "stylesheet" href = "style.css">
</head>
<body>
<p id ="topBar"></p>
<h1>Heading</h1>
<h3>Name</h3>
<p>
Paragraph
</p>
<h3>Heading</h3>
<p>More text</p>
<h3>Send us an email!</h3>
<form>
<input style ="width:200px" type="email" placeholder ="Email" name="email"><br><br>
<textarea style ="height:100px;width:200px"placeholder = "Message" name="message"></textarea><br><br>
<input type="submit" value ="Send" name="send">
</form>
<p id ="bottomBar"></p>
</body>
</html>CSS :
html {
background: url(pen.jpg) no-repeat center fixed;
background-size: cover;
font-family: Garamond;
text-align: center;
opacity: 0.5;
}
h1 {
opacity: 1;
}
