Apprendre à coder sur pierre-giraud.com

DES COURS COMPLETS ET GRATUITS POUR TOUS

SOMMAIRE

Introduction

  1. Présentation du cours
  2. HTML/CSS - Introduction
  3. HTML/CSS - Définitions et rôles
  4. HTML/CSS - Versions
  5. HTML/CSS - Travail en local
  6. HTML/CSS - L'éditeur de texte

Les bases en HTML

  1. HTML - Eléments, balises, attributs
  2. HTML - Structure
  3. HTML - Affichage
  4. HTML - Indentation et comentaires
  5. HTML - Titres et paragraphes
  6. HTML - Espaces et retours à la ligne
  7. HTML - Strong, em et mark
  8. HTML - Listes
  9. HTML - Liens internes et externes
  10. HTML - Autres types de liens
  11. HTML - Images
  12. HTML - Validation
  13. Test n°1

Les bases en CSS

  1. CSS - Sélecteurs, propriétés
  2. CSS - Emplacement
  3. CSS - Commentaires
  4. CSS - Sélecteurs simples
  5. HTML/CSS - Id et class
  6. CSS - L'héritage
  7. HTML/CSS - Block vs inline
  8. HTML/CSS - Div et span
  9. Test n°2

Mise en forme de textes

  1. CSS - Font-family
  2. CSS - Propriétés "font-"
  3. CSS - Couleur et opacité
  4. CSS - Propriétés "text-"
  5. CSS - Les espaces
  6. Test n°3

Le modèle des boîtes

  1. CSS - Le modèle des boîtes
  2. CSS - Dimensions
  3. CSS - Bordures
  4. CSS - Marges
  5. CSS - Ombres
  6. CSS - Affichage
  7. CSS - Positionnement
  8. CSS - Flottement
  9. CSS - Alignement
  10. Test n°4

Gestion du fond

  1. CSS - Couleur de fond
  2. CSS - Image(s) de fond
  3. CSS - Dégradés linéaires
  4. CSS - Dégradés radiaux
  5. Test n°5

Les tableaux

  1. HTML/CSS - Créer un tableau simple
  2. HTML - Structurer son tableau
  3. HTML - Améliorer un tableau
  4. Test n°6

Image, audio, vidéo

  1. HTML/CSS - Les images
  2. HTML - L'audio
  3. HTML - La vidéo
  4. HTML - Intégration et sémantique
  5. Test n°7

CSS avancé

  1. CSS - Long hand vs short hand
  2. CSS - Sélecteurs avancés
  3. CSS - Pseudo classes
  4. CSS - Pseudo éléments
  5. CSS - Sprites
  6. CSS - Transitions
  7. CSS - Animations
  8. Test n°8

Formulaires HTML

  1. HTML - Présentation des formulaires
  2. HTML - Créer un formulaire simple
  3. HTML - Les types d'input et les listes
  4. HTML - Les attributs des formulaires
  5. HTML/CSS - Organiser et mettre en forme un formulaire
  6. Test n°9

Responsive design

  1. HTML/CSS - Introduction au responsive
  2. HTML - Le viewport
  3. CSS - Les media queries
  4. Test n°10

Création d'un site perso (cv)

  1. Présentation de l'exercice
  2. Création des parties "fixes" du site
  3. Création de la page accueil.html
  4. Création des autres pages du site
  5. Conclusion de l'exercice et du cours

Chapitre précédent

Chapitre suivant

Question n°1 :

Citez trois manières pour faire qu'une image occupe sa propre ligne

On peut encadrer notre image avec un élément de type block, utiliser "display:block" sur notre image ou encore faire flotter notre image et utiliser un clear sur l'élément suivant celle-ci.



Question n°2 :

Pourquoi doit-on toujours préciser différents formats audio / vidéo en HTML ?

Tout simplement car il n'existe pas de format audio ou vidéo universellement supporté par les anciennes versions des navigateurs les plus utilisés. Nous indiquons donc plusieurs formats afin que le navigateur puisse "choisir" celui qu'il supporte.



Question n°3 :

Pourquoi n'est-on pas obligé de préciser de valeur pour certains attributs HTML ?

Certains attributs HTML ne possèdent qu'une valeur (qui correspond alors au nom de l'attribut lui-même). Dand ce cas, cette valeur est dite implicite et nous ne sommes pas obligés de la préciser. Cependant, il est considéré comme une bonne pratique de toujours préciser le couple attribut="valeur" en HTML. N'oubliez jamais qu'un attribut possède toujours une valeur.



Question n°4 :

Lequel de ces attributs permet de faire se répéter en boucle une piste audio ou une vidéo ?

  1. L'attribut preload
  2. L'attribut loop
  3. L'attribut autoplay

Réponse 2. L'attribut preload sert à précharger un fichier audio ou vidéo tandis que autoplay sert à lancer automatiquement un fichier audio ou vidéo dès que celui-ci est chargé.



Question n°5 :

Quels sont les trois formats audio les plus utilisés et les mieux supportés ?

Ce sont les formats mp3, ogg et wav.



Question n°6 :

Lequel de ces attributs nous permet d'ajouter une image de fond à notre vidéo (qui s'affichera avant son lancement) ?

  1. L'attribut poster
  2. L'attribut caption
  3. L'attribut controls

Réponse 1. On utilise l'attribut poster pour ajouter une image de fond qui s'affichera avant le lancement d'un fichier vidéo.



Question n°7 :

Quel est l'intérêt majeur de télécharger vos fichiers sur des sites comme YouTube, Daylimotion, etc. pour ensuite les intégrer sur votre site ?

Il y a deux grands avantages à procéder comme cela. Tout d'abord, vous laissez toute la partie encodage à ces sites (et comme vous pouvez vous en douter, c'est bien fait). Ainsi, vous n'avez plus à vous préoccuper des problèmes de compatibilité. Ensuite, vous évitez de surcharger votre espace serveur puisque vos vidéos sont hébergées par ces sites plutôt que sur votre serveur.



Question n°8 :

A quoi servent les éléments figure et figcaption ?

Ces deux éléments servent avant tout à donner des informations sur nos médias au navigateur (et au moteur de recherche). En effet, un navigateur ou un moteur de recherche ne "comprend" pas le contenu d'une image ou d'une vidéo à priori.

Chapitre précédent

Chapitre suivant