Blog ENI : Toute la veille numérique !
Offre estivale️ ☀️ : de -20% à -30% sur les livres en ligne et vidéos, avec le code PLAGE Cliquez ici !
Accès illimité 24h/24 à tous nos livres & vidéos ! 
Découvrez la Bibliothèque Numérique ENI. Cliquez ici
  1. Livres et vidéos
  2. HTML5 et CSS 3 - Exploiter les standards du Web (5e édition)

HTML5 et CSS 3 Exploiter les standards du Web (5e édition)

HTML5 et CSS 3 - Exploiter les standards du Web (5e édition)

Informations

Livraison possible dès le 29 juillet 2024
  • Livraison à partir de 0,01 €
  • Version en ligne offerte pendant 1 an
Livres rédigés par des auteurs francophones et imprimés à Nantes

Caractéristiques

  • Livre (broché) - 17 x 21 cm
  • ISBN : 978-2-409-04554-7
  • EAN : 9782409045547
  • Ref. ENI : OW55HTM

Informations

  • Consultable en ligne immédiatement après validation du paiement et pour une durée de 10 ans.
  • Version HTML
Livres rédigés par des auteurs francophones et imprimés à Nantes

Caractéristiques

  • HTML
  • ISBN : 978-2-409-04555-4
  • EAN : 9782409045554
  • Ref. ENI : LNOW55HTM
Ce livre sur le langage HTML5 et les feuilles de styles CSS 3, langages fondateurs de la création de sites web, s’adresse aux concepteurs et designers qui souhaitent maîtriser ces langages standards pour créer et personnaliser des sites web. Le livre débute par une présentation de l’évolution et de l’usage des stan­dards du Web selon le W3C et le WHATWG avant d’aborder la syntaxe HTML avec les éléments constitutifs des pages web et les attributs des balises. Le chapitre suivant traite des...
Consulter des extraits du livre en ligne Aperçu du livre papier
  • Niveau Initié à Confirmé
  • Nombre de pages 346 pages
  • Parution juillet 2024
  • Niveau Initié à Confirmé
  • Parution juillet 2024
Ce livre sur le langage HTML5 et les feuilles de styles CSS 3, langages fondateurs de la création de sites web, s’adresse aux concepteurs et designers qui souhaitent maîtriser ces langages standards pour créer et personnaliser des sites web.

Le livre débute par une présentation de l’évolution et de l’usage des stan­dards du Web selon le W3C et le WHATWG avant d’aborder la syntaxe HTML avec les éléments constitutifs des pages web et les attributs des balises.

Le chapitre suivant traite des conteneurs sémantiques qui vont permettre de structurer efficacement les pages web. Tous les éléments constitutifs utilisés pour le texte sont ensuite étudiés ainsi que les tableaux et les formulaires. Pour illustrer et animer de manière efficace vos pages web, vous verrez ensuite comment y intégrer des médias : les images mais aussi les vidéos et l’audio.

Dans la deuxième partie de ce livre, vous apprendrez à exploiter les feuilles de styles (CSS) afin de parfaire la mise en page et la mise en forme des pages web. Tous les éléments de syntaxe des CSS sont abordés : les règles, les unités, les valeurs, les couleurs et les déclarations. Les principaux sélecteurs sont détaillés à l’aide d’exemples précis. Vous verrez également l’application des styles basée sur les notions de cascade et d’héritage.

Vous exploiterez les styles pour concevoir des mises en page structurées avec des boîtes et vous verrez comment leur appliquer des styles de mise en forme : marges, remplissage, bordures, largeur, hauteur, arrière-plan… La mise en forme des contenus repose sur de nombreux exemples permettant de mettre en forme les caractères, le texte, les tableaux, les formulaires et les colonnes.

La mise en page des sites modernes utilise les boîtes flexibles (CSS Flexible Box Layout) et les grilles de mise en page (CSS Grid Layout). Ces techniques sont étudiées en détail et illustrées de nombreux exemples. Enfin, pour terminer, le Responsive Web Design, ou mise en page adapta­tive, vous permettra de concevoir des sites web qui seront correctement affichés quel que soit le support : ordinateur, tablette ou smartphone.

Vous aurez ainsi tous les éléments nécessaires pour concevoir et/ou per­sonnaliser des sites web modernes et attractifs.
Introduction
  1. La création des sites web
  2. Les langages du Web
  3. Une brève histoire d'Internet
  4. L'évolution de l'HTML
  5. L'évolution des CSS
  6. L’interprétation des CSS3 par les navigateurs
  7. Les CSS spécialisées
    1. 1. Les pages web à imprimer
    2. 2. Les modules pour les graphistes
    3. 3. L’accessibilité des sites web
Le document HTML
  1. Les objectifs
  2. Les éléments HTML
  3. Les attributs des balises
  4. La déclaration du type de document
  5. L'élément <html></html>
  6. L'élément <head></head>
    1. 1. Les éléments enfants de l’en-tête
    2. 2. Les éléments <meta>
    3. 3. L’élément <title></title>
    4. 4. L’élément <link>
    5. 5. L’élément <style></style>
    6. 6. L’élément <script></script>
  7. L’élément <body></body>
  8. Les commentaires
  9. Exemple d'une structure d'une page web
Les conteneurs de structure
  1. Les objectifs
  2. L'élément <main></main>
  3. L'élément <header></header>
  4. L'élément <footer></footer>
  5. L'élément <aside></aside>
  6. L'élément <nav></nav>
  7. L’élément <section></section>
  8. L'élément <article></article>
  9. L'élément <search></search>
  10. L'élément <div></div>
  11. L'élément <span></span>
  12. Une structure sémantique simple
Les conteneurs pour le texte
  1. Les objectifs
  2. Les attributs usuels
    1. 1. L’attribut de langue
    2. 2. L’attribut de direction du texte
  3. Les titres
  4. Les paragraphes
  5. Les citations
  6. Les listes
    1. 1. Les différents types de liste
    2. 2. Les listes non ordonnées
    3. 3. Les listes ordonnées
    4. 4. L’attribut des items ordonnés
    5. 5. Les listes de définitions
  7. Les adresses
  8. Le texte préformaté
  9. Les liens
    1. 1. La structure des liens
    2. 2. Les liens vers des pages
    3. 3. Les liens internes
    4. 4. L’ouverture des liens
    5. 5. Les relations des liens
    6. 6. Les liens de messagerie
    7. 7. Les liens de téléchargement
    8. 8. Les liens en image
  10. Les lignes horizontales
La mise en forme sémantique du texte
  1. Les objectifs
  2. Les caractères spéciaux
  3. Les emphases
    1. 1. L’emphase forte
    2. 2. L’emphase simple
  4. L'indice et l'exposant
  5. Le souligné et le barré
  6. Les insertions et suppressions
  7. Le retour à la ligne
  8. D'autres mises en forme sémantiques
Les tableaux
  1. Les objectifs
  2. La structure des tableaux
  3. Les lignes
  4. Les cellules
  5. La fusion des cellules
  6. Le titre du tableau
  7. Les groupes de colonnes
    1. 1. Regrouper des colonnes
    2. 2. Cibler les colonnes à grouper
  8. Les tableaux structurés
Les formulaires
  1. Les objectifs
  2. L'intégration des formulaires
  3. La structure des formulaires
    1. 1. Le formulaire
    2. 2. Les étiquettes
    3. 3. Les champs regroupés
    4. 4. Les attributs communs
  4. Les champs de texte
    1. 1. La saisie de texte
    2. 2. Les champs de texte simples
    3. 3. Les champs de texte pour les mots de passe
    4. 4. Les champs de texte multilignes
  5. Les listes de valeurs
  6. Les boutons radio
  7. Les cases à cocher
  8. D’autres types de champs
  9. Les aides à la saisie
    1. 1. Les objectifs
    2. 2. La consigne de saisie
    3. 3. L’activation d’un champ
    4. 4. L’auto-complétion
    5. 5. Les champs obligatoires
  10. Les boutons d’action
  11. Un exemple complet de formulaire
    1. 1. Le code complet du formulaire
    2. 2. Le formulaire
    3. 3. Les boutons radio
    4. 4. Les champs de texte
    5. 5. Le champ numérique
    6. 6. Le champ de l’adresse e-mail
    7. 7. Le champ de date
    8. 8. La liste déroulante
    9. 9. Les cases à cocher
    10. 10. Les boutons d’action
Les médias
  1. Les objectifs
  2. Les images et les formats
  3. Les images avec l'élément <img>
    1. 1. L’attributs scr
    2. 2. L’attribut alt
    3. 3. Les attributs width et height
    4. 4. Les attributs srcset et size
  4. Les illustrations avec l’élément <figure></figure>
    1. 1. L’élément <figure></figure>
    2. 2. L’élément <figcaption></figcaption>
  5. Le multimédia, les formats et les codecs
  6. La vidéo
    1. 1. L’élément <vidéo></vidéo>
    2. 2. Les contrôles
    3. 3. La vidéo préchargée
    4. 4. Une image d’ouverture
    5. 5. Des dimensions spécifiées
    6. 6. Des sources multiples
    7. 7. La boucle et le son désactivé
  7. L'audio
Les feuilles de styles
  1. Les objectifs
  2. La structure des règles de styles
    1. 1. La terminologie
    2. 2. Les règles de styles
    3. 3. Les règles de nommage des sélecteurs
  3. Les unités et les valeurs
    1. 1. Les unités de mesure
    2. 2. Les valeurs calculées
  4. La notation des couleurs
    1. 1. La notation nominative
    2. 2. La notation hexadécimale
    3. 3. Les notations RGB et RGBA
    4. 4. Les notations HSL et HSLA
  5. Les commentaires
  6. La déclaration des styles
    1. 1. Les styles intégrés dans les éléments
    2. 2. Les styles définis dans la page
    3. 3. Les styles définis dans un fichier .css
    4. 4. Les styles importés
  7. Les sélecteurs usuels
    1. 1. L’objectif des sélecteurs
    2. 2. Le sélecteur universel
    3. 3. Les sélecteurs de type
    4. 4. Les sélecteurs de classe
    5. 5. Les sélecteurs de classe de type
    6. 6. Les sélecteurs d’identification
    7. 7. Les sélecteurs d’attribut
  8. Les sélecteurs de pseudo-classes
    1. 1. L’utilisation des pseudo-classes
    2. 2. Les pseudo-classes dynamiques des liens
    3. 3. Les pseudo-classes dynamiques des actions utilisateurs
    4. 4. La pseudo-classe d’ancre
    5. 5. La pseudo-classe de langue
    6. 6. Les pseudo-classes d’état
  9. Les sélecteurs de pseudo-éléments
    1. 1. Le pseudo-élément de premièreligne
    2. 2. Le pseudo-élément de premièrelettre
  10. Les combinaisons de sélecteurs
    1. 1. Les sélecteurs combinés
    2. 2. Les combinaisons descendantes
    3. 3. Les combinaisons d’enfants
    4. 4. Les combinaisons de frères immédiats
    5. 5. Les combinaisons de frères
  11. L’application des styles
    1. 1. La notion d’héritage
    2. 2. La spécificité des sélecteurs
    3. 3. La notion d’importance
    4. 4. La notion de cascade
    5. 5. L’ordre d’application des styles
Les boîtes de mise en page
  1. Les objectifs
  2. Le positionnement des boîtes
    1. 1. Les positions des boîtes
    2. 2. La position relative
    3. 3. La position absolue
    4. 4. La position fixe
  3. Les boîtes flottantes
    1. 1. L’habillage des images
    2. 2. Le flottement interdit
  4. Les boîtes superposées
  5. Le débordement des boîtes
  6. La visibilité des boîtes
Les styles pour les boîtes
  1. Les objectifs
  2. Le concept du modèle de boîte
  3. L'affichage des boîtes
    1. 1. Les principes
    2. 2. Un exemple d’affichage changé
  4. Les marges externes
    1. 1. La marge globale et les marges différenciées
    2. 2. Les syntaxes raccourcies
  5. Les bordures
  6. Les remplissages internes
  7. La largeur et la hauteur
    1. 1. Les dimensions du contenu
    2. 2. Les dimensions d’affichage
  8. Les arrière-plans
    1. 1. La couleur d’arrière-plan
    2. 2. Les images d’arrière-plan
    3. 3. Les dégradés de couleurs
    4. 4. L’opacité des boîtes
  9. Les coins arrondis
  10. Les ombres portées
Les styles pour le texte
  1. Les objectifs
  2. Les styles pour les caractères
    1. 1. Les polices de caractères génériques
    2. 2. Les polices de caractères embarquées
    3. 3. La taille des caractères
    4. 4. D’autres mises en forme de caractères
  3. Les styles pour le texte
    1. 1. Les couleurs
    2. 2. Les lignes de décoration
    3. 3. Les ombres portées
    4. 4. Le changement de casse
    5. 5. Les espaces entre les caractères et les mots
    6. 6. Les alignements du texte
    7. 7. Le retrait de première ligne
    8. 8. La césure en fin de ligne
    9. 9. L’interligne
  4. Les styles pour les listes
    1. 1. Les énumérations
    2. 2. L’énumération avec une image
    3. 3. La position du symbole
    4. 4. La syntaxe raccourcie
  5. Les styles pour les tableaux
    1. 1. La bordure du tableau
    2. 2. Les bordures des cellules
    3. 3. L’espace interne des cellules
    4. 4. Les cellules vides
    5. 5. Le titre du tableau
  6. Les styles pour les formulaires
    1. 1. Les états actif et inactif des objets
    2. 2. Les champs obligatoires
    3. 3. La largeur des étiquettes et des champs
    4. 4. La mise en forme du focus des champs
  7. Les styles pour les colonnes
    1. 1. Les colonnes de texte
    2. 2. La mise en place des colonnes
    3. 3. Des images dans les colonnes
Les boîtes flexibles
  1. Les objectifs
  2. Les conteneurs flexibles
    1. 1. Les différents types de conteneurs
    2. 2. Le conteneur avec un affichage flex
    3. 3. Le conteneur avec un affichage inline-flex
  3. Le flux des éléments enfants
    1. 1. La direction principale
    2. 2. Le contrôle du flux des élémentsenfants en ligne
    3. 3. Le contrôle du flux des élémentsenfants en bloc
  4. Les alignements des enfants flexibles
    1. 1. Les alignements sur l’axe principal horizontal
    2. 2. Les alignements sur l’axe principal vertical
    3. 3. Les alignements sur l’axe secondaire vertical
    4. 4. Les alignements sur l’axe secondaire horizontal
    5. 5. Les alignements et le passage à la ligne
  5. Les propriétés des enfants flexibles
    1. 1. Les propriétés individuelles
    2. 2. L’ordre d’affichage des enfants
    3. 3. L’alignement des enfants
    4. 4. L’agrandissement des enfants
    5. 5. Le rétrécissement des enfants
    6. 6. La largeur des enfants
    7. 7. La syntaxe raccourcie des propriétésindividuelles
  6. Une mise en page plein écran et responsive
    1. 1. Les affichages obtenus
    2. 2. La structure flexible de la mise en page
    3. 3. Les propriétés pour l’élément<body></body>
    4. 4. Les propriétés pour l’élément<main></main>
    5. 5. Les propriétés CSS pour la miseen forme générale
    6. 6. La mise en page responsive
    7. 7. Le code complet de l’exemple
Les grilles de mise en page
  1. Les objectifs
  2. Le vocabulaire des grilles
    1. 1. Les principaux termes
    2. 2. Un exemple simple
  3. La structure des grilles
    1. 1. Le conteneur de la grille
    2. 2. La déclaration des colonnes
    3. 3. La déclaration des lignes
    4. 4. La syntaxe raccourcie
    5. 5. L’utilisation d’autres unités
    6. 6. L’insertion de gouttières
    7. 7. La mise en forme du conteneur
  4. Les positions des éléments dans la grille
    1. 1. Les positions des enfants dans la grille
    2. 2. Les positions des enfants dans les lignes
    3. 3. L’utilisation de la numérotation des lignes
    4. 4. Les lignes nommées de la grille
    5. 5. Les zones nommées de la grille
    6. 6. L’alignement des cellules dans la grille
  5. Une mise en page responsive avec une grille
    1. 1. Les affichages responsives
    2. 2. La structure HTML de la grille
    3. 3. Les styles CSS en Mobile First
    4. 4. La requête de média pour les écransdes tablettes
    5. 5. La requête de média pour les grands écrans
    6. 6. Le code complet de la grille responsive
Le Responsive Web Design
  1. Les objectifs
  2. Les requêtes de média
    1. 1. Les critères
    2. 2. La syntaxe
    3. 3. Les valeurs minimales et maximales
    4. 4. Les opérateurs logiques
  3. La taille des écrans
  4. Un exemple de mise en page responsive
    1. 1. Le site initial
    2. 2. Le site responsive
Auteur : Christophe AUBRY

Christophe AUBRY

Responsable pédagogique dans un centre de formation et formateur sur les technologies Web et les Arts graphiques pendant plus de quinze ans, Christophe AUBRY est aujourd'hui dirigeant de la société netPlume spécialisée dans la rédaction pédagogique et la création de sites internet. Auteur de nombreux livres et vidéos aux Editions ENI (HTML/CSS, RWD, WordPress, Drupal, Joomla…), il reste au fait des nouveautés concernant la conception des sites web en effectuant une veille technologique régulière. Il est également le créateur de la chaîne YouTube LaTeX et la plume.

En savoir plus

Découvrir tous ses livres

  • InDesign 2023 Les fondamentaux de la mise en page
  • HTML5 et CSS 3 Maîtrisez les standards de la création de sites web (3e édition)
  • Photoshop, Illustrator et InDesign 2023 Coffret de 3 livres : Maîtrisez la suite graphique Adobe
  • Photoshop, Illustrator et InDesign 2023 Les fondamentaux
  • InDesign 2023 Pour PC et Mac
  • WordPress Un CMS pour créer et gérer blogs et sites web (2e édition)
  • Bootstrap 5 Un framework pour concevoir vos sites web
  • LaTeX Concevez vos premiers documents élaborés et structurés
  • Bootstrap 5 pour l'intégrateur web Concevez des sites au design moderne
  • WordPress Créer et gérer blogs et sites web
  • Drupal 9 Créer des sites structurés
  • LaTeX Concevez des documents élaborés et structurés
  • Développement Fullstack Coffret de 3 livres : HTML5, CSS3, C#8 et ASP.Net Core - Version en ligne
  • Affinity Photo Maîtrisez la retouche et le montage photos
  • WordPress et WooCommerce (2e édition) Créer votre boutique en ligne
  • WordPress 5 Complément vidéo : Création et mise en valeur des contenus - Version en ligne
  • Flexbox et Grid Créer des sites modernes et responsives
  • InDesign CC pour PC/Mac (édition 2019) Les fonctions essentielles
  • Créez votre premier site web De la conception à la réalisation (3e édition)
  • jQuery Le framework JavaScript pour des sites dynamiques et interactifs (4e édition)
  • Créez votre premier site web De la conception à la réalisation
  • Responsive Web Design Les techniques modernes de mise en page
  • Illustrator CS6
  • InDesign CS6 Les fonctions PAO essentielles
  • Photoshop CS6 Les fonctions essentielles de retouche et montage photo

Nos nouveautés

voir plus
Algorithmique - Techniques fondamentales de programmation Exemples en PHP (nombreux exercices corrigés) (4e édition) Algorithmique - Techniques fondamentales de programmation - Exemples en PHP (nombreux exercices corrigés) (4e édition) HTML5 et CSS 3 Exploiter les standards du Web (5e édition) HTML5 et CSS 3 - Exploiter les standards du Web (5e édition) La data Guide de survie dans le monde de la donnée (2e édition) La data - Guide de survie dans le monde de la donnée (2e édition) Maîtriser et sécuriser le réseau sous Windows Server Maîtriser et sécuriser le réseau sous Windows Server - Référencement de votre site web (7e édition) Intelligence artificielle et outils Google pour optimiser le SEO Référencement de votre site web (7e édition) - Intelligence artificielle et outils Google pour optimiser le SEO UML 2.5 Entraînez-vous à la modélisation UML 2.5 - Entraînez-vous à la modélisation WordPress et PHP Coffret de 2 livres : Apprenez à développer des extensions (4e édition) WordPress et PHP - Coffret de 2 livres : Apprenez à développer des extensions (4e édition) Google Looker Studio Créer des rapports pour l'analyse de données Google Looker Studio - Créer des rapports pour l'analyse de données ASP.NET avec C# Coffret de 2 livres : Développer des applications web (3e édition) ASP.NET avec C# - Coffret de 2 livres : Développer des applications web (3e édition) C++ Des fondamentaux du langage aux applications (4e édition) C++ - Des fondamentaux du langage aux applications (4e édition) Gestion collaborative de projets avec Teams et Microsoft 365 Méthodologie et bonnes pratiques Gestion collaborative de projets avec Teams et Microsoft 365 - Méthodologie et bonnes pratiques InDesign 2023 Les fondamentaux de la mise en page InDesign 2023 - Les fondamentaux de la mise en page