JSFiddle - React, Tailwind, and code Playground
by jmpp77
HTML
<!DOCTYPE html />
<html lang="en">
<head>
<meta charset="UTF-8">
<Title>DiceRoll</Title>
<link rel="stylesheet" href="main.css">
</head>
<body>
<header>
<img src="https://logos-world.net/wp-content/uploads/2021/12/DnD-Emblem.png" alt="Logo D&D" width="200">
<nav>
<ul>
<li><a href="#">Acceuil</a></li>
<li><a href="#">Création</a></li>
<li><a href="#">Visionnage</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</header>
<main>
<article>
<h1>La pulsion du hasard</h1>
<p>Lorsque le destin de votre personnage n'est qu'une question de hasard, bon nombre se mettent à prier malgré une absence de foi. Lorsque la mort regarde votre fiche, alors soudainement, chaque seconde vous parrait un suplice.</p>
<img src="https://i.ebayimg.com/images/g/5P4AAOSw1M9bzgSI/s-l1200.webp" alt="Des dés" width="500">
</article>
<form action="#" method="get">
<label for="name">Prénom</label>
<input type="text" name="" id="name" placeholder="Un pseudo est accepté" required>
<label for="email">Email</label>
<input type="email" name="" id="email" pattern="^^[\w.%+-]+@[\w]+\.[\w]+$" required>
<label for="tel">Téléphone</label>
<input type="tel" name="" id="tel" placeholder="06.XX.XX.XX.XX" pattern="^[0-9]{2}\.[0-9]{2}\.[0-9]{2}\.[0-9]{2}\.[0-9]{2}$">
<label for="comment">Commentaire</label>
<textarea name="" id="comment" cols="30" rows="10"></textarea>
<button>Envoyer</button>
<details>
<summary>A noter</summary>
Bien que chacun soit différent, vous êtes tous des nuls.
</details>
</form>
</main>
<footer>
<p>M'envoyer un <a href="mailto:[email protected]">Mail</a></p>
</footer>
</body>
</html>
CSS
* {
font-size: 1.5rem
}