En dessous, une partie du code proposé par ChatGPT pour qu'il fonctionne dans blogger (vous noterez que je n'ai pris que ce qui était entre la balise de bloc <body> </body>
Lien vers la discussion initiale => Lien vers le chat
 |
| Vue <HTML> de cette article avec blogger |
Titre Principal
Sous-Titre
Texte en gras et texte en italique.
Cliquez ici pour le lienMa première page html
Code html du dessus complet des 4 lignes du dessus:<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ma Page</title>
</head>
<body>
<!-- Titre 1 -->
<h1>Titre Principal</h1>
<!-- Sous-titre -->
<h2>Sous-Titre</h2>
<!-- Paragraphe avec texte en gras et italique -->
<p><strong>Texte en gras</strong> et <em>texte en italique</em>.</p>
<!-- Lien hypertexte -->
<a href="https://2nde-snt-st-herblain-rieffel.blogspot.com/2024/01/balises-html-et-page-web.html" target="_blank">Cliquez ici pour le lien</a>
</body>
</html>
Ensemble de deux pages html
(avec liens entre elles)
page1.html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page 1</title>
</head>
<body>
<h1 style="color: #3366cc;">Titre de niveau 1</h1>
<h2>Sous-titre</h2>
<p><strong>Texte en gras</strong> et <em>texte en italique</em>.</p>
<p><a href="page2.html">Aller à la page 2</a></p>
</body>
</html>
page2.html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page 2</title>
<style>
h1 {
color: #cc3366; /* Couleur rouge par exemple */
}
</style>
</head>
<body>
<h1>Titre de niveau 1</h1>
<h2>Sous-titre</h2>
<p><strong>Texte en gras</strong> et <em>texte en italique</em>.</p>
<p><a href="page1.html">Retour à la page 1</a></p>
</body>
</html>
Ensemble de deux pages avec une feuille de style
Le travail à faire commence ici, en dessous!
page1.html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page 1</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Titre de niveau 1</h1>
<h2>Sous-titre</h2>
<p><strong>Texte en gras</strong> et <em>texte en italique</em>.</p>
<p><a href="page2.html">Aller à la page 2</a></p>
</body>
</html>
page2.html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page 2</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Titre de niveau 1</h1>
<h2>Sous-titre</h2>
<p><strong>Texte en gras</strong> et <em>texte en italique</em>.</p>
<p><a href="page1.html">Retour à la page 1</a></p>
</body>
</html>
style.css
/* style.css */
h1 {
color: #3366cc; /* Couleur bleue par exemple */
}
Aucun commentaire:
Enregistrer un commentaire
Tout commentaire vous engage...