Université Ibn Tofail Année Universitaire 2024/2025
Faculté des sciences de Kenitra SMI-S3
Département d’Informatique
Langage HTML
Exercice 1 :
Donner le code HTML permettant de créer la page Web au-dessous contenant les éléments
suivants :
Le titre de la page « Exercice 1 »
Le titre « Programme Filière SMI », est de type H1 en bleu, taille 18 et centré,
Une ligne séparatrice,
Une liste imbriquée comme indiquée dans la page au-dessous.
Exercice 2 :
Reprendre la page Web de l’exercice précédent en ajoutant les éléments suivants comme
indiqués dans la page Web au-dessous :
Une image du nom « [Link] » à gauche de l’écran de taille 15% en largeur
et 20% en hauteur par rapport à la taille de l’écran,
Un titre H3 de contenu « Contenu de la filière S3 et S4 » contenant un lien hypertexte
vers le document « DescriptifFiliè[Link] »
Un titre H3 de contenu « Contacter professeur » contenant un lien hypertexte vers la
boite à lettre du coordonnateur de la filière : nomProf@[Link], devant une image
du nom « [Link] »
1/4
Exercice 3 :
Donner le code HTML permettant de créer le tableau décrit dans la page WEB au-dessous
avec les effets suivants :
En cliquant sur la première image « [Link] » du tableau, on charge sur le
navigateur le fichier « [Link] » qui se trouve dans le même répertoire.
En cliquant sur la deuxième image « [Link] » du tableau, on charge sur le navigateur
le fichier « [Link] » qui se trouve dans le même répertoire.
En cliquant sur la première image « [Link] » du tableau, on charge sur le
navigateur le fichier « [Link] » qui se trouve dans le même répertoire.
En cliquant sur la deuxième image « [Link] » du tableau, on charge sur le
navigateur le lien externe : [Link]
Exercice 4 :
1. Donner le code HTML permettant de diviser la fenêtre du navigateur en cadres comme le montre
la page WEB au-dessus. Les documents affichés dans cette fenêtre sont (Entê[Link],
[Link], [Link], [Link], [Link] et [Link]) :
(Ces documents se trouvent dans le même répertoire).
2. Donner le code HTML du document « Entê[Link] », ce document est composé de :
Image « [Link] » placée dans la marge gauche du document avec comme
dimension 150 pixel en largeur et 150 pixel en hauteur,
Entete : titre H1 en bleu,
Un lien hypertexte vers une boîte à lettre d’adresse : boite@[Link]
2/4
3. Donner le code HTML du document « [Link] », ce document est composé de :
Sommaire : titre H1 en bleu,
Une liste numérotée contenant les éléments de ce sommaire avec l’effet suivant :
Lorsqu’on clique sur «Langage HTML ou Langage CSS», on charge le contenu du lien
dans le cadre du nom «CadreChap13», et lorsqu’on clique sur «Langage JavaScript ou
Langage JQuery», on charge le contenu du lien dans le cadre du nom «CadreChap24».
Exercice 5 :
Créer une page web nom « [Link] » contenant un formulaire de recherche des documents
dans une bibliothèque de la forme suivante :
Recommandations:
Chaque composant dans le formulaire doit avoir un nom (NAME) distinct.
Les cases à cocher, les boutons d'option et les éléments de la liste déroulante doivent
posséder des valeurs pour l'attribut VALUE.
Les éléments de la liste déroulante sont, dans cet ordre :
Tous
Programmation
Bases de Données
Réseaux
Programmation Internet
Mathématique
Marketing
Gestion
3/4
Exercice 6 :
Donner le code HTML permettant de créer le formulaire d’inscription suivant. Utiliser la
structure du tableau pour aligner les champs de ce formulaire (voir page au-dessous). Les
caractéristiques des champs sont :
Le formulaire a pour nom « Form1 »,
Le tableau à une largeur de 100% et de bordure 2,
Le tableau est composé de 4 lignes et 4 colonnes,
La première cellule de la 4ème ligne du tableau à gauche est une cellule fusionnée sur 3
colonnes,
Les colonnes du tableau ont des largeurs respectivement : 20%, 30%, 20% et 30%,
Les zones de texte Nom, Prénom, CIN et CNE ont une taille maximale de 30
caractères et de taille 20,
4 boutons radios pour le champ filière, avec comme choix par défaut SMI,
La liste déroulante ANNEE contient les éléments suivants : 1ère Année, 2ème Année,
3ème Année, avec comme choix par défaut 2ème année,
La zone texte area est composée de 8 lignes et 100 caractères,
Le bouton Afficher est un bouton scripté,
Le bouton Initialiser est un bouton reset.
4/4