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 :

Pourquoi doit-on préciser plusieurs valeurs pour la propriété font-family ?

  1. Pour laisser la possibilité à l'utilisateur de choisir celle qu'il préfère
  2. Car certaines polices peuvent ne pas être lues par un navigateur
  3. Il n'est pas nécessaire de préciser plusieurs valeurs

Réponse 2. Certaines versions de certains navigateurs peuvent ne pas supporter des polices spécifiques. Pour cela, nous préciserons toujours plusieurs noms de police en valeur de font-family.



Question n°2 :

Pourquoi utiliser les Google Fonts ?

  1. Car Google favorisera notre site si on utilise une de ses polices
  2. Car les polices de Google sont plus jolies
  3. Car ces polices vont pouvoir être lues par tous les navigateurs

Réponse 3. En utilisant une police de Google, vous êtes assuré que tous vos utilisateurs pourront lire votre contenu.



Question n°3 :

A quoi sert la propriété font-weight ?

  1. A modifier le poids d'une police
  2. A modifier l'inclinaison d'une police
  3. A modifier la taille d'une police

Réponse 1. La propriété font-weight, comme son nom l'indique, va nous permettre de gérer le poids d'une police (mise en gras, etc.).



Question n°4 :

Quelle est la différence entre les valeurs de type RGB et RGBa

  1. RGB utilise des notations hexadécimales, ce qui n'est pas le cas de RGBa
  2. RGB gère la transparence à l'inverse de RGBa
  3. RGBa gère la transparence à l'inverse de RGB

Réponse 3. Les valeurs RGBa acceptent un paramètre qui nous permet de définir le niveau d'opacité d'un texte.



Question n°5 :

Que représentent les deux premiers chiffres composant une notation hexadécimale ?

  1. Une intensité de rouge
  2. Une intensité de bleu
  3. Une intensité de vert

Réponse 1. Les deux premiers chiffres représentent l'intensité de rouge dont va être composée notre couleur, les deux suivants l'intensité de vert et les deux derniers l'intensité de bleu.



Question n°6 :

Généralement, on donne une valeur à line-height égale à...

  1. La taille de notre texte
  2. 1,5 fois la taille de notre texte
  3. 2 fois la taille de notre texte

Réponse 2. Il est considéré comme une bonne pratique de régler la valeur du line-height à 1,5 fois la taille de nos textes.



Question n°7 :

Combien faut il donner de valeurs à text-shadow ?

  1. 2 valeurs
  2. 3 valeurs
  3. 4 valeurs

Réponse 3. Il faut donner 4 valeurs à text-shadow. Les trois premières valeurs vont définir l'emplacement et la taille de l'ombre, tandis que la dernière définit sa couleur.



Question n°8 :

Les trois premières valeurs de text-shadow servent à indiquer, dans l'ordre...

  1. La projection horizontale de l'ombre, la projection verticale de l'ombre et le rayon de propagation de l'ombre
  2. La projection verticale de l'ombre, la projection horizontale de l'ombre et le rayon de propagation de l'ombre
  3. La projection horizontale de l'ombre, la projection verticale de l'ombre et la couleur de l'ombre

Réponse 1. Les quatre valeurs de text-shadow servent à préciser dans l'ordre la projection horizontale de l'ombre, la projection verticale de l'ombre, le rayon de propagation de l'ombre et la couleur de l'ombre.

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