Les bases du HTML et du CSS
TD : Les bases du HTML et du CSS. Recherche parmi 300 000+ dissertationsPar jeunemale16 • 18 Novembre 2022 • TD • 755 Mots (4 Pages) • 247 Vues
HTML et CSS/ TP1 BTS SIO 1ère année AP
Les bases du HTML et du CSS
http://fr.openclassrooms.com/informatique/cours/apprenez-a-creer-votre-site-web-avec-html5-et-css3
Les fichiers à récupérer se trouvent sur moodle : AP/ HTML-CSS/ ressources TP1
Vous trouverez la réponse à la plupart des questions sur le site openclassrooms.
Comment fait-on pour créer un site web ?
Quel programme est indispensable pour visualiser un site WEB
Pourquoi 2 langages : le HTML et le CSS ? Expliquez le rôle de chacun.
Quelles sont les dernières versions de ces langages ?
Citez 3 navigateurs.
Goole Chrome / Mozila / Firefox
De quels logiciels a-t-on besoin pour faire un site web en HTML/CSS ?
Quelle est la différence entre les balises en paires et les balises orphelines ?
Qu'est-ce qu'un attribut ? Où se place-t-il ?
Comment insère-t-on des commentaires en HTML ?
Comment fait-on pour afficher le code source de la page ?
- Exercice 1 : corrigez l'exemple suivant :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Je m'eclate avec le HTML</title>
<!--C'est le titre de la fenêtre-->
</head>
<body>
<h1>C'est le titre de ma fenêtre</h1>
<p> Voici mon premier paragraphe</p>
<p><h2> Le titre de mon paragraphe</p></h2>
</body>
</html>
Organiser son texte
Aidez-vous du site du openclassrooms pour remplir ce tableau
Balise | Utilisation |
<h1> | Titre du site web |
<h2> | Titre du second niveaux |
<p> | Paragraphe |
<ul>, <ol> | ol : une liste ordonnée Ça veut dire l'ordre est important. ul : une liste non ordonnée ça veut dire l'ordre non important |
<li> | Représenter un élément dans une liste |
<br/> | crée un saut de ligne (un retour chariot) dans le texte. |
- Exercice 2
Transformer exercice2_avant.html en exercice2_après.html. Votre page doit ressembler à exercice2.jpg
Précisions sur la syntaxe
Règle | Exemple correct | Exemple incorrect |
Les balises fermantes ne sont pas optionnelles. | <p>paragraphe </p> <h1>titre </h1> | <p>paragraphe <h1>titre |
Les éléments vides doivent être fermés. | <br/> | <br> |
Les balises doivent s'imbriquer. | <p><em>texte</em> </p> | <p><em>texte</p></em> |
Les noms de balises doivent être en minuscules. | <ul> | <UL > |
- Exercice 3
Rappel de cours : comment créer des liens
...