|
|
<html lang="fr">
|
|
|
|
|
|
<head>
|
|
|
<meta charset="utf-8" />
|
|
|
<link rel="stylesheet" href="style.css">
|
|
|
<title></title>
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
<header>
|
|
|
<tr>
|
|
|
<tbody>
|
|
|
<td><a href="#">retour à l'accueil</a></td>
|
|
|
<td><a href="#">à propos</a></td>
|
|
|
<td><a href="#">nos newsletters</a></td>
|
|
|
</tbody>
|
|
|
</tr>
|
|
|
</header>
|
|
|
<main>
|
|
|
<div id="title">
|
|
|
<h1>Site d’information culturelles et sportives.</h1>
|
|
|
<h2>Bonjour et bienvenu sur notre site,<br>Depuis cette page nous vous invitons à choisir les abonnements
|
|
|
aux newsletter qui vous conviennent.</h2>
|
|
|
</div>
|
|
|
<input type="checkbox" id="formswitch" hidden checked>
|
|
|
<div id="form">
|
|
|
<form id="popup" method="get">
|
|
|
<label for="formswitch"><span><img src="picture/272-cross.png" alt=""></span></label>
|
|
|
<h4>S'abonner à :</h4>
|
|
|
<hr />
|
|
|
<div class="switch">
|
|
|
<input type="checkbox" name="sport" id="sport" /><label for="sport">sports et activités
|
|
|
sportives</label>
|
|
|
<div class="choix">
|
|
|
<input type="radio" id="s_hebdo" name="sport_freq" value="hebdo" /><label
|
|
|
for="s_hebdo">Hebdomadaire</label>
|
|
|
<input type="radio" id="s_daily" name="sport_freq" value="daily" /><label
|
|
|
for="s_daily">Journalier</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<br />
|
|
|
<div class="switch">
|
|
|
<input type="checkbox" name="culture" id="culture" /><label for="culture">arts et cultures</label>
|
|
|
<div class="choix">
|
|
|
<input type="radio" required id="c_hebdo" name="culture_freq" value="hebdo" /><label
|
|
|
for="c_hebdo">Hebdomadaire</label>
|
|
|
<input type="radio" required id="c_daily" name="culture_freq" value="daily" /><label
|
|
|
for="c_daily">Journalier</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<hr />
|
|
|
<input type="text" name="mail" id="mail" placeholder="votre email" required />
|
|
|
<button type="submit">Enregistrer mon abonnement</button>
|
|
|
</form>
|
|
|
</div>
|
|
|
</main>
|
|
|
<footer>
|
|
|
<a href="https://www.instagram.com/s-et-c">rejoignez notre communauté</a>
|
|
|
<a href="contact@s-et-c.fr">nous écrire</a>
|
|
|
<span>© S&C diffusion 2021</span>
|
|
|
</footer>
|
|
|
</body>
|
|
|
|
|
|
</html> |
