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 commentaires
  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. CSS - Le Flexbox
  5. 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 :

Le rôle du HTML est de...

  1. Mettre en forme du texte
  2. Ordonner du contenu
  3. Créer des sites e-commerce

Réponse 2. Le HTML est un langage de balisage. Son rôle est de donner du sens et de structurer du contenu, afin d'indiquer à un navigateur comment celui-ci doit afficher la page.



Question n°2 :

Pour définir un titre DANS une page HTML, on utilise...

  1. L'élément title
  2. L'élément head
  3. Un élément h1, h2, ... h6

Réponse 3. Pour définir un titre dans une page HTML, on utilise un élément de type "h". L'élément title est utilisé pour définir le titre DE la page (qui s'affichera dans la barre haute du navigateur).



Question n°3 :

Pour créer un lien vers la page d'accueil de Wikipédia, on écrira...

  1. <a target="http://wikipedia.org">Wikipédia</a>
  2. <a href="http://wikipedia.org">
  3. <a href="http://wikipedia.org">Wikipédia</a>

Réponse 3. L'élément a est constitué d'une paire de balises (balises ouvrante et fermante) ainsi que d'un contenu cliquable. Cet élément doit obligatoirement être accompagné de son attribut href.



Question n°4 :

Lorsque vous utilisez l'élément a, vous devez obligatoirement préciser...

  1. Un attribut target
  2. Un attribut href
  3. Deux attributs href et target

Réponse 2. Seul l'attribut href est nécessaire au bon fonctionnement de l'élément a.

Question n°5 :

Laquelle de ces syntaxes est correcte pour écrire un commentaire en HTML ?

  1. <!--Commentaire-->
  2. <--Commentaire-->
  3. <!--Commentaire--!>

Réponse 1. Un commentaire en HTML va s'écrire de cette manière : <!--Commentaire-->. Rappelez vous qu'on utilise un point d'exclamation seulement au début de la balise.

Question n°6 :

Pour indiquer qu'un contenu est très important, on utilise l'élément...

  1. Strong
  2. Em
  3. Mark

Réponse 1. Nous allons utiliser l'élément HTML strong pour marquer un contenu comme étant très important. L'élément em sert à indiquer qu'un contenu est "plutôt important".

Question n°7 :

Quels éléments sont nécessaires pour créer une liste non-ordonnée ?

  1. ul et li
  2. ol et li
  3. ul et ol

Réponse 1. Pour créer une liste non-ordonnée, on utilise les éléments ul et li. "ul" est l'abréviation de "unordered list", c'est-à-dire "liste non ordonnée" en français. "li" signifie "list item", ou "élément de liste".

Question n°8 :

Laquelle de ces syntaxes est correcte ?

  1. <img>src="mon-image.jpg" alt="Une image"</img>
  2. <img src="mon-image.jpg" alt="Une image">
  3. <img href="mon-image.jpg" alt="Une image">

Réponse 2. L'élément img est représenté par une unique balise orpheline et doit être obligatoirement accompagné de ses deux attributs src et alt.

Question n°9 :

A quoi sert l'attribut alt de l'élément img ?

  1. A donner une description de l'image si celle-ci ne peut pas s'afficher
  2. A donner un lien alternatif vers l'image si le premier est cassé
  3. A afficher une deuxième image si la première ne peut pas s'afficher

Réponse 1. L'attribut alt sert à décrire l'image. Cela est essentiel dans le cas où l'image ne pourrait pas être affichée ainsi que pour les personnes mal voyantes ou non voyantes.

Question n°10 :

Pourquoi doit-on toujours essayer d'avoir un code HTML valide ?

  1. Pour minimiser le nombre de bugs potentiels
  2. Pour optimiser son référencement
  3. Pour éviter des problèmes d'affichage futurs

Réponses 1, 2 et 3 !

Chapitre précédent

Chapitre suivant

2015-2017 - Tous droits réservés à Pierre Giraud.

Il est strictement interdit de copier et de distribuer le contenu de ce site sans l'accord express de son propriétaire.

En continuant votre navigation sur ce site, vous acceptez l'utilisation des cookies.

N'oubliez pas de me suivre !

Lien vers ma page Facebook Lien vers ma chaine YouTube Lien vers mon compte Twitter