Table des matières

PRESENTATION GENERALE DU WEB ET DES PAGES WEB .................... 5

Chapitre I : LES BASES DE HTML .................................................................. 8

I-1. INTRODUCTION ........................................................................................................... 8

1-1. HTML .................................................................................................................................... 8

1-2. BALISE HTML ........................................................................................................................ 8

1-3. INBRICATION DES BALISES ................................................................................................... 9

1-4. ATTRIBUTS ........................................................................................................................... 9

1-5. STRUCTURE DE BASE D’UNE PAGE HTML5 .......................................................................... 9

1-6. VISUALISATION DU CODE HTML ........................................................................................ 11

I-2. CORPS DU DOCUMENT - body ................................................................................ 11

2-1. NIVEAUX DE TITRE ................................................................................................................ 11

2-2. PARAGRAPHES DE TEXTE ...................................................................................................... 11

2-3. SAUT DE LIGNE ...................................................................................................................... 12

2-4. ELEMENTS DE MISE EN FORME DE TEXTE ............................................................................ 13

2-5. LISTES .................................................................................................................................... 14

2-6. TABLEAUX ............................................................................................................................. 15

2-7. CRÉATION DES LIENS ..................................................................................................... 18

2-8. FORMULAIRES ....................................................................................................................... 22

Chapitre II : LES STYLES CSS ...................................................................... 31

II-1. MISE EN PLACE DE CSS ......................................................................................... 31

II-1-1. FICHIER .CSS ....................................................................................................................... 31

II-1-2. APPLIQUER UN STYLE : SÉLECTIONNER UNE BALISE. ........................................................ 34

II-1-3. APPLIQUER UN STYLE A PLUSIEURS BALISES. .................................................................... 37

II-1-4. DES COMMENTAIRES DANS DU CSS .................................................................................. 38

II-1-5. APPLIQUER UN STYLE : class et id...................................................................................... 38

II-1-6. LES BALISES UNIVERSELLES ............................................................................................... 40

III-1-7. APPLIQUER UN STYLE : LES SÉLECTEURS AVANCES .......................................................... 40

II-2. FORMATAGE DU TEXTE .......................................................................................... 43

II-2-1. TAILLE ................................................................................................................................ 43

ESUM EVARISTE ANDRE Ratsimbazafy -3-

II-2-2. POLICE ................................................................................................................................ 45

II-2-6. ALIGNEMENT ..................................................................................................................... 48

II-3. LA COULEUR ET LE FOND ...................................................................................... 51

II-3-1. COULEUR DU TEXTE ........................................................................................................... 51

II-3-2. COULEUR DE FOND ............................................................................................................ 55

II-3-3. LE CSS ET L'HÉRITAGE ........................................................................................................ 56

II-3-4. IMAGES DE FOND .............................................................................................................. 57

II-3-5. OPTIONS DISPONIBLES POUR L'IMAGE DE FOND ............................................................. 58

II-3-6. COMBINER LES PROPRIÉTÉS. ............................................................................................. 59

II-3-7. PLUSIEURS IMAGES DE FOND ............................................................................................ 60

II-3-8. LA TRANSPARENCE ............................................................................................................ 60

II-4. LES BORDURES ET LES OMBRES ......................................................................... 62

II-4-1. BORDURES STANDARD ...................................................................................................... 62

II-4-2. BORDURES ARRONDIES ..................................................................................................... 64

II-4-3. OMBRES ............................................................................................................................. 64

II-5. CRÉATION D'APPARENCES DYNAMIQUES .......................................................... 66

II-5-1. AU SURVOL ........................................................................................................................ 66

II-5-2. AU CLIC ET LORS DE LA SÉLECTION ................................................................................... 67

Chapitre III : MISE EN PAGE DU SITE .......................................................... 69

III-1. STRUCTURER SA PAGE. ........................................................................................ 69

III-1-1. <header>: L'EN-TÊTE ..................................................................................................... 69

III-1-2.<footer>: LE PIED DE PAGE .................................................................................. 69

III-1-3. <nav>: PRINCIPAUX LIENS DE NAVIGATION......................................................... 69

III-1-4. <section>: UNE SECTION DE PAGE ................................................................... 70

III-1-5. <aside>: INFORMATIONS COMPLÉMENTAIRES ................................................. 70

III-1-6. <article>: UN ARTICLE INDÉPENDANT ............................................................ 70

EXEMPLE CONCRET D'UTILISATION DES BALISES ........................................................................ 72

III-2. MODÈLE DES BOÎTES ............................................................................................ 72

III-2-1. LES BALISES DE TYPE BLOCK ET INLINE ............................................................................. 73

III-2-2. LES BALISES UNIVERSELLES .............................................................................................. 75

III-2-3. LES DIMENSIONS .............................................................................................................. 75

III-2-4. MINIMUM ET MAXIMUM ................................................................................................. 77

III-2-5. LES MARGES ..................................................................................................................... 78

ESUM EVARISTE ANDRE Ratsimbazafy -4-

III-2-6. CENTRER DES BLOCS. ........................................................................................................ 79

TRAVAUX PRATIQUES ................................................................................. 81

HTML .............................................................................................................................. 81

EXERCICE 1. .............................................................................................................................. 81

EXERCICE 2. .............................................................................................................................. 81

EXERCICE 3. .............................................................................................................................. 81

EXERCICE 4. .................................................................................................................................. 82

EXERCICE 5. .................................................................................................................................. 82

CSS .................................................................................................................................... 85

EXERCICE 6. Copier-coller les fichiers du dossier TP_Cinema dans le dossier www/cinéma/. . 85

CORRIGES ....................................................................................................... 88

HTML .............................................................................................................. 88

Exercice1. ........................................................................................................................... 88

Exercice2. ........................................................................................................................... 88

Exercice3. ........................................................................................................................... 90

Exercice4. ........................................................................................................................... 90

Exercice5. ........................................................................................................................... 90

CSS .................................................................................................................. 99

Exercice6. ........................................................................................................................... 99

BIBLIOGRAPHIE ........................................................................................... 103