0% ont trouvé ce document utile (0 vote)
84 vues1 page

TP HTML et CSS : Manipulation Essentielle

Ce document présente les étapes pour manipuler le HTML et le CSS à travers des travaux pratiques. Il décrit comment structurer une page web, mettre du contenu et modifier la mise en forme à l'aide de ces langages.

Transféré par

Primus ASSOKOU
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
84 vues1 page

TP HTML et CSS : Manipulation Essentielle

Ce document présente les étapes pour manipuler le HTML et le CSS à travers des travaux pratiques. Il décrit comment structurer une page web, mettre du contenu et modifier la mise en forme à l'aide de ces langages.

Transféré par

Primus ASSOKOU
Copyright
© © All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

TRAVAUX PRATIQUES

Manipuler ÉTAPE 2 : Étudier la page web


TP 1 1 H1 30 MIN
HEURE
le HTML et le CSS 
Examiner l’élément
OBJECTIF : 

DOC. 2 – Inspecteur Mozilla (HTML et CSS)
MATÉRIEL : <!DOCTYPE html>
<html lang="fr_FR"> Question 3 : Modifiez
 <head> …</head> le titre
<body>
 <!-- corps de la page -->
<h1>Titre de la page</h1>
<h2>Un titre plus petit: liste non
Le HTML permet de structurer une page web numérotée </h2>
et d’y mettre du contenu. Le CSS est dédié à <ul>…</ul>
<h2>Liste numérotée </h2>
la mise en forme de la page. <ol>…</ol>
La programmation se fait avec un éditeur de <h4>Un titre encore plus petit</h4>
<p>Ceci est un paragraphe contenant du
texte (ici Notepad++) et un navigateur (ici texte...</p>
Firefox) pour visualiser le résultat. <p>...</p>
< img src="[Link]" alt
ÉTAPE 1 : "Lorient" width="100%">
<p>un petit texte…</>
1      <footer>…</footer>
</body>
 et  </html>
 *****Extrait CSS de l'élément*****
Filtrer les styles Question 4 : Modifiez le
# Fichier TP1 élément{
fond de la page
[Link] }
/ 19snt04 body{
font-family: 'Century Gothic', Calibri,
2       serif;
 font-size: 13px;
text-align:Center;
background-color: Aqua;
DOC. 1 – Visualisation de la page modèle
}

3      


       
Modifier comme HTML   
       
Ctrl + R permet de
retrouver la page initiale.

4 
       Aqua


ÉTAP
présentation
5    [Link] 
[Link]
6 [Link]


7     


 
       



Vous aimerez peut-être aussi