HTML (I)

Lycée Bousalem
Niveau : 3 Sciences de l’Informatique

TECHNOLOGIES DE L’INFORMATION ET DE LA COMMUNICATION
Chapitre I : LE LANGAGE HTML
I. INTRODUCTION AU LANGAGE HTML :

Les pages Web visualisées dans un navigateur Internet sont écrites avec un langage nommé HTML
(HyperText Markup Language). C’est un langage de description de contenu et de structure.
Les pages HTML sont indépendantes de toute plate-forme, et donc bien adaptées à des échanges
d’informations dans un environnement hétérogène comme le Web.
Le langage HTML est composé d’un ensemble de balises (tags).
Une balise est un élément spécial qui indique une action concernant la mise en page, la mise en forme
ou la structure logique d’un document.
Activité 1 :
 Créer un nouveau dossier sous la racine « C:\ » nommé « tphtml »
 Dans le dossier « tphtml », créer un nouveau document texte nommé « tp1.html »
Constatations :
 Le fichier texte s’est transformé en page Web ce qui signifie qu'une page Web n’est rien
d’autre qu’un fichier texte enregistré avec l’extension html (ou htm).
 En double cliquant sur ce fichier, le navigateur se lance avec comme contenu le fichier
«tp1.html » ce qui signifie que le langage HTML utilisé pour la création des pages Web, est
un langage interprété, dont l’interpréteur est le navigateur installé sur la machine de test, tel
que : Firefox, Internet Explorer, Netscape, …
Activité 2 :
 Dans le répertoire de travail, créer un nouveau fichier « tp2.html »
 Rechercher une image d'extension « .jpg » sur votre disque dur, pour la copier dans votre
répertoire de travail avec le nom « img1.jpg »
 Saisir le code HTML donné ci-dessous avec l’éditeur web disponible.
 Enregistrer et tester le fichier résultat
Activité 2
<html>
<head>
<title> MA PREMIERE PAGE </title>
</head>
<body>
<center>
Ma page Web 
<hr>
<img src="img1.jpg" width="280" height="350">
</center>
</body>
</html>
http://chihi-lotfi.jimdo.com 1
Constatations :
 Un document HTML peut contenir un ensemble de balises tels que :
<head>, <body>, <title>, <html>, , <hr>, <img>
 Les balises HTML sont inclues entre les signes inférieur (<) et supérieur (>
 Les balises HTML ne sont pas sensibles à la casse.
 Syntaxiquement, les balises rencontrées peuvent être réparties en quatre catégories :
 Des balises composées d'une partie ouvrante et d'une partie fermente sans
propriétés, tel que <head>….</head>,
 Des balises composées d'une seule partie ouvrante sans propriétés tel que : 
 Des balises composées d'une partie ouvrante et d'une partie fermante avec des
propriétés, tel que : ...,
 Des balises composées d'une partie ouvrante avec des propriétés, tel que
<img src="image1.jpg" width="80" height="78" >
II. STRUCTURE D’UN DOCUMENT HTML :

Document html
Constatations :
 Un fichier HTML commence par la balise <html> et finit par la balise </html>
 La partie entête délimitée par <head> et </head> sert à définir le titre de la page Web qui sera
affiché dans la barre du titre du navigateur (entre <title> et </title>) et à indiquer un certain
nombre d'informations facultatives tel que les mots clés, la date de création,…A l’exception
du titre, le contenu de cette section n’est pas directement visible pour le visiteur.
 La partie corps du document délimité par <body> et </body> est utilisée pour définir le
contenu de la page Web.
 Le titre d’une page ne peut pas contenir de mise en forme ou d’images
III. LES BALISES HTML :
1. Les textes et les paragraphes :
Activité 3 :
 Dans le répertoire C:\tphtml, créer un nouveau fichier « tp3.html »
 Saisir le code HTML donné ci-dessous
 Enregistrer et tester le fichier.
Activité 3
<html>
<head>
<title> Textes et Paragraphes</title>
</head>
<body>


 Développement Web


<hr color="#884412" width="400" size="5">
<center>
les langages pour le Web
</center>
<hr color="#000000" width="500">
 Langage HTML
 Langage Javascript
 Langage PHP 
 <s>Langage Pascal</s>
</body>
</html>
Constatations :
 Le texte défini entre <body> et </body> sans balises, sera repris par le navigateur avec les
propriétés de mise en forme par défaut, de ce dernier.
 La balise permet un retour à la ligne,
 La balise provoque un passage à la ligne (espacement inter paragraphe).
 La balise permet de changer la police, la couleur et la taille du texte.
 Les styles d’écriture : gras, italique et souligné s'appliquent respectivement avec les balises 
(bold), (italic) et (underline).
 La balise <center> permet d'appliquer un alignement centré.
 La balise <hr> permet d'insérer une ligne horizontale.
 Dans de la balise <hr>, la propriété width permet de définir la largeur de la ligne horizontale qui
est mesurée soit en pixels, soit en pourcentage par rapport à son conteneur (page).
Le tableau ci-dessous représente quelques balises qui manipulent les textes et les paragraphes :
Fonctions Balises et Exemples

 texte 
Texte en gras
 Informatique
 texte 
Texte en italique
 Technologies 
 texte 
Texte souligné
 Algorithmique
<s> texte </s>
Texte barré
<s> Communication</s>
 texte 
Texte en exposant
X 2 
 texte 
Texte en indice
H 2 O
 
Retour à la ligne
Sport Musique
<center> texte/paragraphe </center>
Texte centré
<center> Fichiers </center>
Mise en forme de texte/paragraphe 
caractères Base de données 
Ligne de séparation <hr size="…" color="…" align="…">

(horizontale) <hr size="2" color="blue" align="center">
 paragpraphe 
Nouveau paragraphe
 Web dynamique 
Alignement de paragraphe 

paragraphe SGBD Relationnelle 


Commentaire
<!-- ceci est un commentaire -- >

HTML (I)

Transféré par

Informations du document

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

HTML (I)

Transféré par

Droits d'auteur :

Formats disponibles

Lycée Bousalem

Niveau : 3 Sciences de l’Informatique

I. INTRODUCTION AU LANGAGE HTML :

II. STRUCTURE D’UN DOCUMENT HTML :

Fonctions Balises et Exemples

Ligne de séparation <hr size="…" color="…" align="…">

Alignement de <p align ="…."> paragraphe </p>

Vous aimerez peut-être aussi