Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

Professeur : Bart Kimps Les cahiers d'Exercices en Programmation : Le langage H

Professeur : Bart Kimps Les cahiers d'Exercices en Programmation : Le langage HTML Apprenez et entraînez vos acquis - De très nombreux exercices à réaliser par vous-même et avec les corrigés. Professeur : Bart Kimps AVANT-PROPOS Ce livre est un cahier d'exercices : il vous propose des énoncés d'exercices et leurs corrigés. Vous allez apprendre le logiciel en vous entrainant à travers des exercices regroupés par thème. Chaque énoncé vous présente l'exercice à réaliser. Vous trouverez à la fin du cahier le corrigé de chaque exercice. Certaines explications peuvent-être présentes. METHODOLOGIE Lors de la réalisation des exercices, vous pourrez remédier à certain problème à l'aide des corrections à la fin du cahier. Après avoir réalisé tous les exercices de chaque chapitre vous allez pouvoir vérifier les compétences acquises à l'aide du tableau des objectifs. Celui-ci sert à la cotation du professeur (grille d'évaluation). Des légendes ou recommandations peuvent être présentes dans certains exercices. Celles-ci vous aideront dans vos recherches. Elles ne doivent pas être reproduites dans votre travail. Chaque point de matière acquis dans un exercice peut être utilisé dans des exercices suivants sans explication. Professeur : Bart Kimps Table des matières Table des matières CHAPITRE 1 : INTRODUCTION ...................................................................................................... 1 Le WEB ............................................................................................................................................................. 1 Internet ............................................................................................................................................................ 1 Naviguer sur le Web ......................................................................................................................................... 1 Qu’est-ce que HTML ? ...................................................................................................................................... 2 Exercice : .......................................................................................................................................................... 3 CHAPITRE 2 : UN PEU PLUS EN PROFONDEUR ............................................................................. 4 Les services ...................................................................................................................................................... 4 Les navigateurs ................................................................................................................................................ 4 Création de pages Web .................................................................................................................................... 4 HTML utilise des balises ................................................................................................................................... 4 Structure des balises ........................................................................................................................................ 5 Types de balises ............................................................................................................................................... 5 Les attributs ..................................................................................................................................................... 6 La règle d'imbrication ....................................................................................................................................... 6 Définition de type de document ....................................................................................................................... 6 Structure générale ........................................................................................................................................... 6 CHAPITRE 3 : UTILISER HTML ....................................................................................................... 8 Faire des headings ............................................................................................................................................ 8 Quelques balises à retenir ................................................................................................................................ 8 Les commentaires ............................................................................................................................................ 9 Exercices : ...................................................................................................................................................... 10 CHAPITRE 4 : ADRESSES ET LIENS .............................................................................................. 11 Les adresses web ............................................................................................................................................ 11 Professeur : Bart Kimps Les adresses web à travers le monde ............................................................................................................. 12 Créer un lien hypertexte ................................................................................................................................ 12 Exercices : ...................................................................................................................................................... 12 CHAPITRE 5 : UN PEU DE COULEUR ........................................................................................... 13 Texte en couleurs ........................................................................................................................................... 13 Modifie la couleur d'arrière-plan.................................................................................................................... 13 Styles et attributs ........................................................................................................................................... 14 Exercices ........................................................................................................................................................ 15 CHAPITRE 6 : LES TABLEAUX ...................................................................................................... 16 Les attributs ................................................................................................................................................... 17 Exercice .......................................................................................................................................................... 18 Autres attributs de <table>… </table> ........................................................................................................... 18 Autres attributs de <tr>… </tr> ...................................................................................................................... 19 Autres attributs de <td>… </td> ..................................................................................................................... 19 CHAPITRE 7 : LES LISTES ............................................................................................................ 20 Listes de définitions ....................................................................................................................................... 20 Listes numérotées .......................................................................................................................................... 21 Listes à puces ................................................................................................................................................. 21 Exercice .......................................................................................................................................................... 22 CHAPITRE 8 : LES LIENS .............................................................................................................. 23 Introduction ................................................................................................................................................... 23 Introduire un lien ........................................................................................................................................... 23 Lien pour envoyer un email ............................................................................................................................ 24 Lien vers une ancre ........................................................................................................................................ 25 À retenir ......................................................................................................................................................... 25 CHAPITRE 9 : LES IMAGES .......................................................................................................... 26 Professeur : Bart Kimps Insérer une image .......................................................................................................................................... 26 À retenir ......................................................................................................................................................... 27 CHAPITRE 10 : LES FORMULAIRES .............................................................................................. 28 Intérêt d'un formulaire .................................................................................................................................. 28 Les éléments d'un formulaire ......................................................................................................................... 28 L'élément SELECT ........................................................................................................................................... 30 L'élément TEXTAREA : Zone de commentaire ou de texte .............................................................................. 31 Traitement des formulaires ............................................................................................................................ 31 À retenir ......................................................................................................................................................... 32 Exercice .......................................................................................................................................................... 34 BIBLIOGRAPHIE.......................................................................................................................... 36 Professeur : Bart Kimps 1 Chapitre 1 : Introduction Chapitre 1 : Introduction Tu te sers peut-être tous les jours du «Word Wide Web » pour chercher des informations, écouter de la musique ou regarder des vidéos. Dans ce cahier tu vas découvrir comment créer une page web et apprendre à utiliser l'HTML. Le WEB Le WEB Les ordinateurs peuvent être liés entre eux par des câbles et, le plus souvent aujourd’hui, par des liens sans fil. Les ordinateurs connectés entre eux forment ce qu’on appelle un réseau. Un réseau peut être utilisé pour partager des informations et des ressources. Le Web a été inventé par l’informaticien britannique Tim Berners-Lee en 1989. Internet Internet Vaste réseau d’ordinateurs connectés à travers le monde entier. Naviguer sur le Web Naviguer sur le Web Que signifie http ? Toute personne utilisant Internet doit obéir à certaines règles sur le partage d’informations. Sans elles, chacun ferait à sa façon et il serait impossible d’échanger de l’information à travers le monde. Ces règles s’appellent des protocoles. Le protocole utilisé sur le web porte le nom anglais d’Hypertexte Transfert Protocole, ou « http ». Tu as certainement déjà remarqué ces lettres dans les adresses des sites. HTTP est une manière commune de transporter des pages Web sur Internet. Professeur : Bart Kimps 2 Qu’est-ce que HTML ? Qu’est-ce que HTML ? Les pages web sont écrites dans un langage spécial (un code) appelé HTML (pour « Hypertext Mark-up Language » en anglais). Dans ce cahier, tu vas apprendre à utiliser l'HTML pour créer tes propres pages. L'HTML n'est donc pas un langage de programmation proprement dit, il s'agit simplement d'un langage de balisage dont le rôle est de formaliser l'écriture d'un document Web avec des balises. Il sert à dire : "Ceci est mon titre, ceci est mon menu, là c'est le texte principal de la page, là il y a une image, etc.". Il peut être associé au CSS (voir cours Cahiers d'exercices en CSS) pour créer des pages Web avec styles. Le CSS servira à dire :"Mes titres sont en rouge et sont soulignés, mon texte est dans la police Arial, mon nom est centré, mon menu a un fond blanc, etc.". Une balise ou "marqueur" (Tag en anglais) est un mot propre au langage HTML permettant de structurer et définir les propriétés ainsi que le contenu d'une page Web. Une page HTML est donc un simple fichier texte contenant des balises permettant de mettre en forme la page (les titres, les paragraphes, les images, les liens…) et peut donc très facilement être conçue grâce à un éditeur de texte. Professeur : Bart Kimps 3 Exercice : Exercice : Lance le programme JEdit, Notepad ++, Coteditor (mac), … Le cahier est réalisé à partir de Notepad ++. Quand le programme est lancé, modifie la reconnaissance du langage et tape le code suivant en essayant de la comprendre : La reconnaissance du langage permet par exemple que les balises se colorent afin de bien les identifier. Enregistre ton premier programme Ex1 dans un dossier HTML situé dans ton dossier personnel (Fichier - Enregistrer Sous ou Fichier – Enregistrer).. Pour afficher ta page Web avec un navigateur, clique 2 fois sur celle-ci à partir de l'explorateur et tu dois choisir par exemple comme navigateur Firefox. Fin du premier exercice. Professeur : Bart Kimps 4 Chapitre 2 : Un peu plus en profondeur Chapitre 2 : Un peu plus en profondeur Les services Les services Pour partager sur Internet les pages web que tu as réalisées, tu dois les charger sur un ordinateur spécial appelé un serveur. Mais ne t’en fais pas : pour apprendre à créer des pages web, tu as juste besoin de travailler sur un ordinateur de bureau ou portable. Elles resteront privées pour le moment ! Les navigateurs Les navigateurs Pour consulter une page internet, il faut utiliser un programme spécial appelé un navigateur. Parmi les navigateurs les plus connus, on trouve aujourd’hui Chrome, Firefox, Internet Explorer et Safari. Un navigateur utilise le http pour accéder aux pages web, puis interprète le code en HTML afin d’afficher les pages sur ton écran. Création de pages Web Création de pages Web Si tu veux créer une page web, tu dois l’écrire en utilisant un code ou langage spécial, appelé HTML. Pour cela, tu as besoin d’un programme que l’on nomme éditeur de texte (NOTEPAD++ ; JEDIT, …), qui te permettra d’écrire ton code en HTML, et d’un navigateur pour visualiser le résultat. HTML utilise des balises HTML utilise des balises Pour identifier ce qui appartient à une page web, on utilise des codes spéciaux appelés balises, ou "tags". Les balises sont toujours écrites entre < >. Une page doit commencer par une balise <HTML> de début et une balise </HTML> de fin. Professeur : Bart Kimps 5 Structure des balises Structure des balises Les balises délimitent une fraction du document HTML (paragraphe, titre, …) Elles peuvent être imbriquées entre elles et se présentent comme ci-dessous (dans une balise on peut en trouver d'autres) : Ex2 1 : On peut remarquer qu'une balise peut contenir trois types d'informations :  Un nom de balise ;  Une liste d'attributs ;  Une chaîne de caractères. Las balises sont toujours écrites en minuscule. Elles sont toujours délimitées par les signes < et >. Elles fonctionnent généralement par paire : une balise ouvrante <html> par exemple et une balise fermante </html>. Elles délimitent ensembles le contenu. Mais bien sûr pour faire facile, ce n'est pas toujours le cas. Nous verrons quelques exceptions dans la suite du cours. Les balises peuvent comporter de zéro à plusieurs attributs. Les attributs sont des informations complémentaires qui les caractérisent. Types de balises Types de balises Les balises de type inline : ce sont des balises que l’on utilise à l’intérieur uploads/s3/ cours-de-html-exercices-et-corrections.pdf