<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"> <!-- Définit l'encodage des caractères de la page -->
<link rel="stylesheet" href="style.css"> <!-- Importe une feuille de style externe -->
</head>
<body>
<div id="titre" style="padding: 50%;"> <!-- Définit une division avec l'identifiant "titre" et un style inline pour le padding -->
<h1 style="color: red; text-align: center;">Hello World!</h1> <!-- Affiche un titre de niveau 1 centré en rouge -->
</div>
<script>
const titre = document.getElementById('titre'); // Sélectionne l'élément avec l'identifiant "titre"
titre.addEventListener('click', () => { // Ajoute un écouteur d'événements au clic sur l'élément "titre"
alert("Hello World!"); // Affiche une boîte de dialogue avec le message "Hello World!"
});
</script>
</body>
</html>Ce projet contient un fichier HTML qui affiche un simple message "Hello World!" centré en rouge. Lorsque l'utilisateur clique sur le titre, une boîte de dialogue affiche à nouveau le message "Hello World!".
- Clonez ou téléchargez ce projet sur votre ordinateur.
- Ouvrez le fichier
index.htmldans votre navigateur web préféré. - Cliquez sur le titre "Hello World!" pour afficher une boîte de dialogue avec le même message.
- HTML
- CSS
Paul-Franck Dencausse
Open Source
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent