HTML5 et CSS3

HTML5 et CSS3

by Jean Engels
Released April 2012
Publisher(s): Eyrolles
ISBN: 9782212134001

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Cours d'initiation aux standards du Web, avec exercices corrigés

HTML5 et CSS3 sont aujourd'hui pris en compte par tous les navigateurs du marché et suscitent un tel niveau d'adhésion que tout professionnel ou futur professionnel se doit de maîtriser ces nouvelles versions des standards du Web sans attendre leur publication définitive par le W3C.

Premier ouvrage en langue française spécifiquement conçu pour les étudiants, ce manuel met l'accent sur les bonnes pratiques de développement (séparation stricte entre structure et présentation), en préconisant l'emploi d'une syntaxe rigoureuse héritée de XHTML. Il consacre une large place aux nouveautés de HTML5 et CSS3 : nouveaux éléments de structure sémantique, nouveaux éléments audio et vidéo, Media Queries pour l'adaptation des pages Web au terminal de l'utilisateur (écran d'ordinateur, tablette, smartphone), stockage local, nouveaux sélecteurs CSS, nouveaux types de contours et d'ombrage, arrière-plans multiples et dégradés de couleur, multicolonnage et effets de texte, etc.

Pour vous aider à valider et mettre en oeuvre vos connaissances, vous trouverez en fin de chaque chapitre une série d'exercices dont les corrigés et le code source sont disponibles sur les sites www.editions-eyrolles.com etwww.funhtml.com.

A qui s'adresse ce livre ?

  • Aux étudiants en cursus d'informatique ou de design Web.
  • A tous les concepteurs de sites Web souhaitant s'autoformer à HTML5 et CSS3.
  • Aux enseignants et formateurs à la recherche d'une méthode pédagogique pour enseigner les standards du Web.


Au sommaire

  • Le langage HTML5
    • Introduction à HTML5
    • Structure d'un document HTML5
    • Structurer le contenu d'une page
    • Insérer des images et du multimédia
    • Créer des liens
    • Créer des tableaux
    • Créer des formulaires
  • Les styles CSS
    • Introduction à CSS 2 et 3
    • Couleurs et images de fond
    • Créer des bordures, des marges, des espacements et des contours
    • Style du texte et des liens
    • Dimensionnement, positionnement et transformation des éléments
    • Style des listes
    • Compléments
  • A. Référence des éléments HTML5
  • B. Référence CSS3
  • C. Codes des couleurs
  • D. Entités de caractères
  • E. Bibliographie et adresse utiles

Table of contents

  1. Couverture
  2. Page de titre
  3. Copyright
  4. Table des matières
  5. Avant-propos
  6. PARTIE I - Le langage HTML 5
    1. CHAPITRE 1 - Introduction à HTML 5
      1. Généalogie de HTML 5
      2. Les éléments, balises et attributs
        1. Les attributs de base de HTML
        2. Intérêt de la sémantique
      3. Règles de base HTML 5
        1. Un document bien formé
        2. Un document conforme
        3. Validation d’un document : le label du WHATWG et W3C
      4. L’environnement de travail
        1. Les éditeurs visuels
        2. Les éditeurs classiques
      5. Tests et mise en place du site
      6. Référencement du site
    2. CHAPITRE 2 - Structure d’un document HTML 5
      1. Les éléments de base
        1. La déclaration DOCTYPE
        2. L’élément racine <html>
        3. L’en-tête d’un document : l’élément <head>
        4. Les commentaires
        5. Les méta-informations : l’élément <meta />
        6. Le corps du document : l’élément <body>
      2. Exercices
    3. CHAPITRE 3 - Structurer le contenu d’une page
      1. Les grandes divisions de la page
        1. L’élément <div>
        2. Les nouveaux éléments HTML 5
      2. Les divisions secondaires
        1. Les titres et groupes de titres
        2. Les paragraphes : l’élément <p>
        3. Les articles et les sections
        4. Les divisions de bloc locales
        5. Les éléments des divisions sémantiques du texte
      3. Les styles physiques
        1. Mettre un texte en gras
        2. Mettre un texte en italique
        3. Modifier la taille du texte
        4. Créer des exposants et des indices
        5. Afficher du texte dans une police à espacement fixe
        6. Créer un retour à la ligne
        7. Surligner un texte
      4. Les listes
        1. Les listes ordonnées
        2. Les listes non ordonnées
        3. L’élément de menu
        4. Les listes imbriquées
        5. Les listes de définitions
      5. Exercices
    4. CHAPITRE 4 - Insérer des images et du multimédia
      1. Les types d’images
      2. L’insertion d’images
        1. L’élément <img />
        2. Titre d’une image
      3. Les images réactives
      4. L’insertion d’images en tant qu’objets
      5. Images et boutons
      6. L’insertion du multimédia
        1. L’insertion d’une animation Flash en HTML 5
        2. L’insertion d’une vidéo avant HTML 5
        3. L’insertion d’une vidéo en HTML 5
        4. L’insertion d’éléments audio avant HTML 5
        5. L’insertion d’éléments audio en HTML 5
        6. L’insertion d’une applet Java
        7. Jauges et barre de progression
      7. Exercices
    5. CHAPITRE 5 - Créer des liens
      1. Les liens à partir d’un texte
        1. Les liens externes
        2. Les liens ciblés : les ancres
        3. Lien à partir d’une image ou d’un bouton
        4. Créer plusieurs liens sur la même image
        5. Lien déclenchant l’envoi d’un e-mail
        6. Les liens déclenchant un script JavaScript
      2. Exercices
    6. CHAPITRE 6 - Créer des tableaux
      1. La structure générale d’un tableau
      2. Créer des groupes de lignes et de colonnes
        1. Les groupes de lignes
        2. Les groupes de colonnes
      3. Créer des tableaux irréguliers
        1. Fusion de colonnes
        2. Un cas particulier de fusion de colonnes
        3. Fusion de lignes
      4. Imbrication de tableaux
      5. Organisation d’une page à l’aide de tableaux
      6. Exercices
    7. CHAPITRE 7 - Créer des formulaires
      1. Structure d’un formulaire
        1. Les attributs de l’élément <form>
      2. Les composants communs
        1. Bouton d’envoi et de réinitialisation
      3. Les composants de saisie d’informations
        1. La saisie d’une ligne de texte
        2. La saisie de mot de passe
        3. La saisie de texte long
        4. La saisie d’adresse e-mail
        5. La saisie de numéro de téléphone
        6. La saisie d’URL
        7. La saisie de l’heure, la date, la semaine, le mois
        8. La saisie des nombres
        9. Choisir une couleur
        10. Le composant de recherche
      4. Les boutons radio et les cases à cocher
      5. Les listes de sélection
      6. Les champs cachés
      7. Le transfert de fichiers
      8. Un formulaire complet
      9. Organisation des formulaires à l’aide de tableaux
      10. Exercices
  7. PARTIE II - Les styles CSS
    1. CHAPITRE 8 - Introduction à CSS 2 et 3
      1. Créer des styles
        1. Les règles générales
        2. Les sélecteurs
        3. Les sélecteurs d’attributs
        4. Pseudo-classes et pseudo-éléments
        5. La déclaration !important
      2. Écrire des feuilles de style
        1. Dans l’élément <style>
        2. Dans un fichier externe
        3. Dans l’attribut style
      3. Cascade et héritage
        1. Sélection selon le média
        2. Sélection selon le créateur du style
        3. Sélection par spécificité
        4. Sélection selon l’ordre d’apparition
        5. L’héritage
      4. Les unités
        1. Les unités de longueur
        2. Les couleurs
        3. Les couleurs et opacités en CSS 3
      5. Exercices
    2. CHAPITRE 9 - Couleurs et images de fond
      1. La couleur d’avant-plan
      2. La couleur de fond
      3. CSS 3 : couleurs de fond en dégragé
        1. Dégradé linéaire
        2. Dégradé radial
      4. Les images de fond
        1. Définir une image de fond
        2. Positionner une image de fond
      5. Un raccourci pour les fonds
      6. Les images de fond multiples en CSS 3
      7. Exercices
    3. CHAPITRE 10 - Créer des bordures, des marges, des espacements et des contours
      1. Le modèle CSS des boîtes
      2. Les bordures
        1. Le style de la bordure
        2. La largeur de la bordure
        3. La couleur de la bordure
        4. Définition globale d’une bordure
      3. Bordures en CSS 3
        1. Bordures multicolores
        2. Bordures en images
        3. Bordures arrondies
        4. À l’ombre des boîtes
      4. Les marges
      5. Les espacements
      6. Les contours
        1. Le style du contour
        2. La couleur du contour
        3. La largeur du contour
      7. Exercices
    4. CHAPITRE 11 - Style du texte et des liens
      1. Les polices
      2. Les polices externes en CSS 3
      3. La taille des polices
        1. Les tailles absolues
        2. Les tailles relatives
        3. Les tailles dimensionnées
        4. Les tailles en pourcentage
      4. La graisse du texte
      5. Le style des polices
      6. Ombrage de texte en CSS 3
      7. Régler l’interligne
      8. Définir plusieurs propriétés en une fois
      9. L’alignement et l’espacement du texte
        1. L’alignement horizontal du texte
        2. L’indentation du texte
        3. L’espacement des mots et des caractères
      10. Césure des mots en CSS 3
      11. Le style des liens
      12. Exercices
    5. CHAPITRE 12 - Dimensionnement, positionnement et transformation des éléments
      1. Le dimensionnement des éléments
      2. Le rendu des éléments
      3. Le positionnement des éléments
        1. Le flottement
        2. Empêcher le flottement
        3. Positionnement relatif
        4. Positionnement absolu
        5. Positionnement fixe
      4. Visibilité et ordre d’empilement
      5. Affichage multicolonne en CSS 3
      6. Redimensionnement par l’utilisateur en CSS 3
      7. Transformations des éléments en CSS 3
        1. Les translations en CSS 3
        2. Les rotations en CSS 3
        3. Agrandissement et réduction en CSS 3
        4. Déformation de la boîte du conteneur
        5. Les transitions des transformations en CSS 3
      8. Exercices
    6. CHAPITRE 13 - Style des tableaux
      1. Le modèle de gestion des tableaux
        1. Les couleurs des cellules
      2. Les titres des tableaux
      3. La gestion des bordures des cellules
        1. Les bordures séparées
        2. Les bordures fusionnées
      4. Déterminer la largeur d’un tableau
      5. Présentation d’un formulaire
      6. Exercices
    7. CHAPITRE 14 - Style des listes
      1. La numérotation des listes
      2. Les listes à puces
        1. Les puces prédéfinies
        2. Les puces graphiques
        3. Les listes mixtes
      3. Affichage des listes en ligne
      4. Affichage d’éléments divers sous forme de liste
      5. Exercices
    8. CHAPITRE 15 - Compléments
      1. Les Media Queries CSS 3
        1. Cibler un média précis et adapter les styles
        2. Mise en pratique
        3. L’impression du contenu
      2. Stockage local de données
        1. Enregistrement des données
        2. Effacement des données
        3. Une application de gestion de contacts
      3. Dessin vectoriel SVG
        1. Inclusion dans le code HTML 5
        2. Les formes
        3. Le texte
      4. Exercices
  8. ANNEXE A - Référence des éléments HTML 5
  9. ANNEXE B - Référence CSS 3
    1. Référence des propriétés
  10. ANNEXE C - Codes des couleurs
  11. ANNEXE D - Entités de caractères
  12. ANNEXE E - Bibliographie et adresses utiles
    1. Bibliographie
    2. Adresses utiles
  13. Index

Product information

  • Title: HTML5 et CSS3
  • Author(s): Jean Engels
  • Release date: April 2012
  • Publisher(s): Eyrolles
  • ISBN: 9782212134001