100 Exercices HTML
100 Exercices HTML
1. Problème HTML : Créez une page avec les balises minimales qu'elle doit avoir et dans le corps de celle-ci, indiquez votre nom.
nom de famille.
[Link]ème HTML : Créer une page qui affiche les noms de 5 langages de programmation séparés par un tiret.
[Link]ème de HTML :Créer une page HTML qui affiche différents langages de programmation, les afficher un par ligne.
[Link]ème de HTML : Créer une page HTML qui affiche votre nom et prénom et sur la ligne suivante les prénoms de vos parents.
séparés par un tiret.
5. Problème HTML : Créez une page qui affiche deux paragraphes. Dans le premier, ajoutez plusieurs sauts de ligne.
6. Problème HTML : Créez une page qui affiche dans un paragraphe des informations concernant vos études et dans un autre paragraphe votre nom et
mail.
7. Problème de HTML : Créer une page qui contient un titre de premier niveau <h1> et ensuite deux titres de niveau <h2>. Définir un
paragraphe pour chaque titre de second niveau.
8. Problème HTML : Créer le titre d'un journal avec un titre de niveau 1. Ensuite, définir deux titres de deuxième niveau avec les
textos (Noticias políticas y Noticias deportivas), en cada una de estas secciones definir dos titulares de tercer nivel con un párrafo cada
à la fin de la page, afficher un titre de quatrième niveau avec le nom de l'entreprise propriétaire du journal.
9. Problème de HTML : Créer une page contenant quatre paragraphes. Dans le premier, mettre en évidence avec le niveau maximum et dans les autres.
paragraphes utiliser l'élément de souligner de moindre force.
10. Problème HTML : Créer une page qui affiche la définition de trois mots. Appliquer l'élément strong à chaque mot
avant sa définition. Puis ajouter l'élément em à un ou à un ensemble de mots dans la définition.
11. Problème : Créer une page principale qui ait un hyperlien vers une autre page secondaire. La page secondaire doit avoir
également un hyperlien vers la page principale.
[Link]ème : Concevoir une page principale avec deux hyperliens vers les pages [Link] et [Link]
Ensuite, sur les deux pages secondaires, ajouter des hyperliens vers la page principale.
[Link]ème : Créer une page qui contient un hyperlien vers un journal (indiquer seulement le nom de domaine du journal).
Disposer également d'un deuxième hyperlien vers une page spécifique de ce journal.
14. Problème de HTML : Implémenter une page qui affiche une image appelée [Link] qui se trouve sur le même serveur et dans
le même dossier où se trouve le fichier HTML.
15. Problème HTML : Développer une page qui affiche deux images appelées [Link] et [Link], celles-ci se trouvent
stockées sur le serveur dans le même dossier où sera stockée la page que vous développerez.
Donner un titre à chaque image.
[Link]ème: Créer une page contenant un hyperlien vers un journal (indiquer uniquement le nom de domaine du journal).
Disposer également d'un deuxième hyperlien vers une page déterminée de ce journal.
[Link]ème : Créer une page contenant un lien vers le site de Google.
[Link] de HTML
mêmes liens, le premier "Ouvrir dans une autre fenêtre" et le deuxième "Ouvrir dans le même navigateur".
19. Problème de HTML : Concevoir une page contenant un hyperlien en configurant la propriété href de manière à ce qu'elle s'ouvre
un client de messagerie.
20. Problème de HTML : Une entreprise qui vend des pizzas a 3 offres. Ce sont ( 1- 1 muzzarella et une boisson cola à 5 pesos, 2-
2 muzzarellas à 6 pesos et 3 - 4 muzarrellas à 10 pesos). Confectionner une page qui dispose de trois hyperliens vers chacune de celles-ci.
offres. En étant pressées, ouvrez le client de messagerie et envoyez la promotion correspondante. Dans le titre, indiquer s'il s'agit de la
promotion 1, 2 or 3. In the body of the message ask to enter the address and phone number of the person placing the order.
21. Problème : Créer une page contenant quatre ancres, puis définir quatre hyperliens qui se lient à ces ancres.
22. Problème : Disposer une série d'hyperliens sur les nouvelles du jour. Lier les hyperliens avec des ancres qui se trouvent plus
en bas de la même page.
[Link]ème : Créer une page contenant quatre ancres et une deuxième page qui définit quatre hyperliens reliés.
avec ces ancres.
24. Problème : Disposer une série d'hyperliens sur les actualités du jour. Lier les hyperliens avec des ancres qui se trouvent dans une autre
page.
[Link]ème HTML : Afficher l'ordre d'arrivée de trois coureurs en utilisant l'élément HTML ol.
Puis ajouter d'autres éléments à la liste.
Liste des trois pays les plus peuplés du monde
deuxième niveau et en dessous de la liste, la somme des habitants de ces trois pays en évidence.
27. Problème HTML : Créer une page HTML contenant une liste non ordonnée avec quatre langages de programmation très
populaires. Ajouter un titre de deuxième niveau indiquant le concept de cette liste.
28. Problème de HTML : Établir une liste non ordonnée contenant des hyperliens vers différents journaux que vous connaissez. Ajouter
autant d'articles que de journaux connaît.
29. Problème de HTML : Créer une page HTML qui contient une liste non ordonnée avec quatre langages de programmation très
populaires. Ajouter un titre de deuxième niveau indiquant le concept de cette liste.
30. Problème de HTML : Créer une liste non ordonnée contenant des hyperliens vers différents journaux que vous connaissez. Ajouter
tant d'articles que de journaux il connaît.
31. Problème de HTML : Concevoir une liste de définitions indiquant dans les concepts différents langages de programmation.
définition faire une brève introduction de celui-ci.
32. Problème de HTML : Établissez une liste de définition d'un ensemble de mots que vous utilisez dans votre domaine professionnel.
33. Problème HTML : Implémenter une page qui énumère une série de pays dans une liste ordonnée, puis pour chaque pays disposer
une liste d'hyperliens de journaux de ce pays.
34. Problème HTML : Créez une liste non ordonnée de langages de programmation. Ensuite, disposez une liste ordonnée avec
hyperliens vers des sites qui traitent de ces langages.
[Link]ème HTML : Créer un tableau qui affiche les noms des pays dans une colonne et leur nombre d'habitants dans une autre.
[Link]ème de HTML : Établir un tableau qui affiche dans la première colonne les noms de différents employés d'une entreprise
et dans le second, le salaire brut (la société a 4 employés).
37. Problème de HTML : confectionner un tableau qui affiche les noms des pays dans une colonne et leur nombre d'habitants dans une autre.
Disposer un titre à chaque colonne à l'aide de cellules créées avec l'élément th.
[Link]ème de HTML : Confectionner un tableau qui affiche dans la première colonne les noms de différents employés d'une entreprise
Nom de l'employé
ligne du tableau.
39. Problème de HTML : Créer un tableau qui affiche les noms de pays dans une colonne et leur population dans une autre.
Disposer d'un titre pour les données représentées par le tableau.
[Link]ème HTML : Créer un tableau qui affiche dans la première colonne les noms de différents employés d'une entreprise
et dans le deuxième, le salaire brut (l'entreprise a 4 employés) Disposer dans le tableau un titre représentatif.
[Link]ème de HTML : Créer un tableau montrant la facturation des trois derniers mois des articles : 'Disques Durs',
'CPU' y 'Monitores'. La primera columna debe mostrar solo el texto 'recursos' y en la primer fila el texto 'Facturación de los últimos tres
mois
42. Problème de HTML : Créer un tableau affichant les noms de journaux et leur nom de domaine regroupés par pays. En
La première colonne dispose les noms des pays, s'étendre en ligne en fonction du nombre de journaux de chaque pays.
43. Problème : Créer deux pages qui initialisent l'élément title. Placer un hyperlien sur chaque page.
[Link]ème : Créer une page qui affiche dans l'élément title le nom de domaine du site.
[Link]ème:Créer une page HTML. Définir l'élément title et les métadonnées pour indiquer l'auteur, les mots-clés pour
moteurs de recherche, description de la page et copyright.
[Link]ème de HTML : Créer une page contenant un tableau. Stocker dans un commentaire des données concernant le contenu de
la table qui n'intéresse que le développeur.
[Link]ème de HTML : Créer une page qui affiche deux tableaux. Puis commenter le second et voir le résultat.
[Link]ème HTML : Afficher l'équation suivante : 10+x*y ajouter ici le symbole inférieur 12*z
[Link]ème de HTML : Afficher un tableau avec deux colonnes, dans la première énumérer une série d'articles et dans la seconde leurs prix
(ajouter le symbole Euro à chaque prix)
50. Problème de HTML : Créer un formulaire contenant une zone de texte où le visiteur doit entrer son nom et un
bouton de type submit pour l'envoi des données saisies au serveur (tenir compte que la page qui traite les données de
le formulaire sur le serveur se trouve à la racine du site et s'appelle : [Link]
[Link]ème de HTML : Créer un formulaire qui demande le nom d'une personne et son âge. Puis appeler à la
page "/[Link]" pour afficher à l'écran les valeurs saisies. Disposer d'un bouton de type soumettre pour l'envoi des
données.
[Link]ème de HTML : Créer un formulaire qui demande l'entrée du nom d'un utilisateur et de son mot de passe. Afficher des astérisques là où
la clé est saisie. Prévoir deux boutons, un pour l'envoi de données au serveur et un autre pour effacer le contenu de tous les contrôles
(éditeurs de texte) qui contient le formulaire.
53. Problème de HTML : Créer un formulaire qui demande l'entrée d'un e-mail d'une personne et ensuite demande l'entrée de son mot de passe deux fois.
fois (se rappeler d'initialiser la propriété name de l'élément input avec des noms différents pour chaque contrôle).
Problème de HTML : Élaborer un formulaire pour qu'un visiteur puisse saisir son nom, son mail et un commentaire sur le site.
en utilisant pour cette dernière donnée à saisir un élément de type textarea.
55. Problème de HTML : Confectionner un formulaire qui permet d'entrer le nom d'une personne, son email, son DNI (document d'identité)
nationale d'identité) et enfin son curriculum (ce dernier donnée à faire en utilisant une zone de texte)
56. Problème HTML : Mettre en place un formulaire demandant l'entrée du nom d'une personne et 4 éléments de type case à cocher
pour qu'il sélectionne les langages de programmation qu'il connaît.
[Link]ème HTML : Demander l'entrée du nom d'une personne et le niveau d'études le plus élevé atteint (sans études, études
primaires, études secondaires ou études universitaires) Utiliser des contrôles de type radio pour la sélection des études réalisées.
58. Problème de HTML : Créez un formulaire qui demande l'entrée d'un e-mail, d'un mot de passe et qui affiche ensuite une série de titres de
films avec leur case à cocher respective. Disposer également d'un bouton de type submit pour l'envoi de données au serveur.
[Link]ème HTML : Créer un formulaire demandant quel système d'exploitation est le plus utilisé (Linux ou Windows)
Confectionner un formulaire qui demande de saisir le nom d'une personne et le pays où elle vit, ce dernier
élément par le biais d'un contrôle de type select permettant de sélectionner le pays. (Ajoutez la propriété size à l'élément select avec la valeur 5).
61. Problème de HTML : Créer un formulaire qui demande le nom d'une personne et permet de voter pour le site.
Un tableau de sélection, le visiteur peut choisir parmi les options suivantes : Excellent, Très Bon, Bon, Acceptable et Mauvais.
62. Problème HTML : Créer un champ de sélection multiple pour choisir des couleurs dans une liste. Permettre la sélection de plusieurs.
couleurs.
63. Problème HTML : Créer un formulaire qui affiche dans un contrôle select une série de mails. Puis permettre au visiteur
sélectionnez un ou plusieurs mails dans la boîte de sélection.
64. Problème HTML : Créer une page qui affiche un contrôle de type select. Regrouper les options en deux groupes, l'un les
fruits et dans l'autre les légumes. Utiliser l'élément optgroup pour le regroupement.
65. Problème HTML : Créez un contrôle de type select avec les noms des pays d'Amérique et d'Europe. Regroupez les pays par
continent.
66. Problème HTML : Créer un formulaire demandant l'entrée du nom d'une personne et deux éléments bouton pour télécharger.
le donnée au serveur ou supprimer la donnée chargée.
67. Problème de HTML : Concevoir un formulaire qui demande l'entrée du nom d'utilisateur et de son mot de passe. Disposer d'un bouton pour
subir los datos al servidor (en el botón escribir el texto: "Ingreso al" y en la línea siguiente "sitio").
68. Problème de HTML : Nous allons créer une page qui affichera le clavier d'une calculatrice. Utiliser l'élément input.
initialisant la propriété type avec la valeur "button".
69. Problème de HTML : Créer une page qui affiche une question et ensuite trois réponses possibles. À côté de chaque réponse
disposer d'un bouton créé avec l'élément input en initialisant la propriété type avec la valeur="button"
70. Problème HTML : Créer un formulaire qui demande l'entrée du nom d'une personne et permet de sélectionner et d'envoyer son
photo.
71. Problème de HTML : Créer un formulaire qui demande et envoie deux fichiers au serveur.
[Link]ème de HTML: Créer un formulaire qui demande d'entrer le nom d'une personne et dans un champ caché stocke une
n'importe quelle heure.
[Link]ème HTML : Concevoir un formulaire qui demande les données personnelles d'une personne et les données de l'endroit où elle travaille.
Chaque groupe de données doit être disposé dans un fieldset.
74. Problème HTML : Créer un formulaire pour demander des pizzas à domicile. Regrouper les contrôles liés.
avec le client et les référents de la commande.
75. Problème HTML : Créez un formulaire qui demande le nom d'une personne. Ensuite, sélectionnez si elle est majeure.
de l'âge ou non (par défaut initialiser à oui), ensuite le téléphone (charger par défaut 453-) et enfin dans un textarea demander que
entrez des commentaires.
76. Problème HTML : Créez un formulaire pour un livre d'or, il doit demander le nom, l'e-mail, le pays d'origine (par défaut
l'option sélectionnée doit être "sélectionner un pays"), évaluation du site (mauvais, moyen, bon, très bon, excellent) par défaut doit
être sélectionné "bon". Enfin, disposer d'une zone de texte où l'on peut saisir des commentaires.
[Link]ème HTML : Mettre en œuvre un formulaire contenant une matrice de trois lignes et trois colonnes d'éléments de type texte.
Faire en sorte que le focus soit par colonne, c'est-à-dire qu'il prendra d'abord le focus sur le texte de la première ligne et de la première colonne, puis sur le texte de la deuxième.
fila et première colonne etc. (si nous ne définissons pas la propriété tabindex, le chargement des données se fait par ligne)
78. Problème HTML : Créer un formulaire qui affiche trois contrôles de type radio. Afficher les textes Enfants, Adolescents et
Adultes. Désactiver l'élément radio correspondant à Enfants.
79. Problème de HTML : Créer un formulaire qui affiche un contrôle de chaque type et les affiche tous désactivés. (Quand
Découvrez JavaScript, nous pouvons les activer par exemple si le visiteur saisit un mot de passe correct, pour l'instant voyez à quoi cela ressemble visuellement.
formulaire avec les contrôles désactivés.
[Link]ème de HTML : Créer un formulaire qui demande le saisie du nom et du prénom d'une personne (jusqu'à 40 caractères),
son âge (3 caractères au maximum) et son document national d'identité (jusqu'à 8 caractères).
[Link]ème HTML : Créer un formulaire qui affiche le nom d'une entreprise dans un texte et le texte d'un contrat dans un
zone de texte, tous deux en lecture seule.
82. Problème de HTML : Créer des contrôles de type texte, mot de passe et zone de texte. Les rendre tous en lecture seule.
[Link]ème de HTML: Créer une page permettant de faire une réclamation pour des réparations et d'envoyer les données à une adresse de
courriel. Il doit être possible d'entrer le nom, l'adresse et un commentaire sur le problème.
84. Problème de HTML : Concevoir un formulaire permettant de demander des pizzas à domicile. Envoyer la commande à l'adresse e-mail
pizzasya@[Link]
[Link]ème de HTML : Créer un formulaire qui demande l'entrée du nom, de l'email et des commentaires d'un visiteur du site.
Associer chaque contrôle avec un élément label.
86. Problème de HTML : Créer une page qui permet d'évaluer un site. Il faut entrer le nom et par un contrôle de
type select choisir une valeur entre 1 et 10. Associar des éléments de type label à chaque contrôle.
[Link]ème : Confectionner une page qui contient deux cadres verticaux, le premier occupant 20 % et le second 80 % de la
fenêtre.
[Link]ème : Créer une fenêtre contenant 3 cadres horizontaux. Pour cela, définir la propriété row de l'élément frameset.
avec la valeur suivante : lignes="20 %, 60 %, 20 %"
89. Problème : Concevoir une fenêtre contenant deux cadres verticaux. Disposer deux hyperliens dans le cadre de gauche qui
Lorsqu'ils sont pressés, mettez à jour le fichier à afficher dans le cadre de droite.
[Link]ème: Créer une page contenant deux cadres verticaux. Dans le cadre de gauche, disposer des hyperliens à
journaux de votre pays. Lorsque vous cliquez sur le lien hypertexte, mettez à jour le cadre de droite avec la page principale de ce journal
(veillez à noter que les frames peuvent afficher des pages se trouvant sur différents serveurs).
91. Problème : Réaliser une page contenant trois cadres verticaux, celui de gauche et celui de droite doivent avoir 200
pixels de large, le suivant occupe le reste.
92. Problème : Créer une fenêtre contenant 3 cadres horizontaux. Faire en sorte que le cadre supérieur ait une hauteur de 80.
pixels, le cadre inférieur 100 pixels et le cadre central occupe le reste.
[Link]ème : Créer une fenêtre avec deux cadres verticaux. Ne pas permettre de les redimensionner et ne pas afficher les bordures des cadres.
Faire en sorte que le cadre de droite affiche toujours la barre de défilement.
94. Problème : Fabriquer une page avec deux cadres horizontaux. Dans la partie supérieure, définir un cadre de 100 pixels de haut. Faire
que le même ne puisse pas être redimensionné, ne montre pas la barre de défilement et ne montre pas la bordure.
[Link]ème : Créer une page où la première colonne a un cadre et la deuxième colonne a deux cadres. Utiliser un ensemble de cadres.
imbriqués pour résoudre le problème.
[Link]ème : Créer une page contenant deux lignes. La première ligne affiche un cadre de 70 pixels de hauteur et la deuxième ligne
diviser en deux colonnes qui ont deux cadres, le premier de 200 pixels et l'autre du reste des pixels restants. Faire en sorte que ne se
puissent redimensionner.
-------------------------------------------------
| |
| |
| |
-------------------------------------------------
| | |
| | |
| | |
| | |
| | |
| | |
| | |
| | |
| | |
| | |
| | |
-------------------------------------------------
[Link]ème : Créer une page qui incorpore un iframe de 400 pixels de large par 200 pixels de haut.
98. Problème : Créer une page qui affiche deux iframes de 300*300 pixels chacun. Faire en sorte que les barres de défilement
soyez toujours visibles.
[Link]ème de HTML : Créer la première page du tutoriel, modifier pour qu'elle valide le code HTML 4.01 Transitional. Ensuite
copiez et collez le code HTML sur le site de validation
1//.Problème HTML : Créez une page contenant une liste imbriquée et un tableau.
Faire la page qui valide avec HTML 4.01 transitoire.
Ensuite, copiez et collez le code HTML sur le site de validation