musique + css

This commit is contained in:
NohamR 2023-06-07 16:13:47 +02:00
parent accf561b4b
commit 9b69a0d767
4 changed files with 63 additions and 56 deletions

View File

@ -2,10 +2,11 @@
<html lang="fr">
<head>
<link rel="stylesheet" href="src/style.css">
<link rel="shortcut icon" href="src/balle.png" type="image/x-icon">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<title>Projet-foot</title>
</head>
<body>
<h1>Accueil</h1>
@ -21,7 +22,7 @@
<a href="V7.zip" class="play-button"><h2>Jouer !</h2></a>
</div>
<audio controls autoplay style="display: none;">
<source src="src/musique.mp3" type="audio/mp3">
<source src="src/extrait.mp3" type="audio/mp3">
Votre navigateur ne prend pas en charge l'élément audio.
</audio>
</body>

BIN
src/balle.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 108 KiB

BIN
src/extrait.mp3 Normal file

Binary file not shown.

View File

@ -1,58 +1,64 @@
:root {
-webkit-touch-callout: none;
-ms-user-select: none;
-moz-user-select: none;
user-select: none;
}
body{
background-image:url('Arriereplan.jpg');
background-size: cover;
background-image:url('Arriereplan.jpg');
background-size: cover;
}
h1 {
font-family: Noto Sans, sans-serif;
text-align: center;
font-size: 80px;
color: white;
margin-top: 50px;
}
h2 {
font-family: Comic Sans MS, Comic Sans, cursive;
text-align: center;
font-size: 22px;
color: white;
margin-bottom: 20px;
}
.container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 50px;
}
.quote {
text-align: center;
margin-bottom: 20px;
}
.image-container {
text-align: center;
margin-bottom: 20px;
}
img {
width: 525px;
height: 350px;
border-radius: 20px;
border-style: solid;
border-width: 3px;
}
.play-button {
display: inline-block;
padding: 10px 20px;
background-color: #007bff;
color: #fff;
text-decoration: none;
border-radius: 4px;
font-size: 18px;
margin-top: 20px;
}
font-family: Noto Sans, sans-serif;
text-align: center;
font-size: 80px;
color: white;
margin-top: 50px;
}
h2 {
font-family: Comic Sans MS, Comic Sans, cursive;
text-align: center;
font-size: 22px;
color: white;
margin-bottom: 20px;
}
.container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 50px;
}
.quote {
text-align: center;
margin-bottom: 20px;
}
.image-container {
text-align: center;
margin-bottom: 20px;
}
img {
width: 525px;
height: 350px;
border-radius: 20px;
border-style: solid;
border-width: 3px;
}
.play-button {
display: inline-block;
padding: 10px 20px;
background-color: #007bff;
color: #fff;
text-decoration: none;
border-radius: 4px;
font-size: 18px;
margin-top: 20px;
}