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 :

Le rôle du CSS est de...

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

Réponse 1. Le CSS sert à mettre en forme du contenu, en y ajoutant des "styles".



Question n°2 :

Quel est l'emplacement recommandé pour le CSS ?

  1. Dans un élément HTML style
  2. Dans un attribut HTML style
  3. Dans un fichier ".css" séparé

Réponse 3. Il est recommandé, pour des raisons de clarté et de maintenabilité du code, d'écrire le code CSS dans un fichier séparé.



Question n°3 :

Qu'est ce que "color" en CSS ?

  1. Un sélecteur
  2. Une propriété
  3. Une déclaration

Réponse 2. "color" est ce qu'on appelle une propriété CSS. Une propriété CSS sert à modifier un style en particulier de nos éléments HTML.



Question n°4 :

Comment sélectionne t-on le div class="div1" en CSS ?

  1. Avec le sélecteur "div1"
  2. Avec le sélecteur "#div1"
  3. Avec le sélecteur ".div1"

Réponse 3. On peut sélectionner un élément possédant un attribut class en CSS en précisant la valeur de l'attribut précédée d'un point.

Question n°5 :

Laquelle de ces propositions est exacte ?

  1. On doit donner une valeur unique à un attribut id mais pas à des attributs class
  2. On doit donner une valeur unique à un attribut class mais pas à des attributs id
  3. On doit donner une valeur unique à chaque attribut class et id dans une page

Réponse 1. On peut tout à fait attribuer plusieurs attributs class avec la même valeur à plusieurs éléments HTML. En revanche, c'est interdit avec l'attribut id.

Question n°6 :

Un élément de type block...

  1. Occupe toute la largeur disponible dans la page
  2. N'occupe que la largeur nécessaire à son contenu
  3. Occupe toute la largeur disponible dans son élément parent

Réponse 3. Un élément de type block va par défaut occuper toute la largeur qui lui est disponible, c'est à dire la largeur correspondant à son élément parent.

Question n°7 :

Quelle est la différence majeure entre les éléments div et span ?

  1. L'élément span est de type block, l'élément div est de type inline
  2. L'élément div est de type block, l'élément span est de type inline
  3. L'élément div sert de conteneur, au contraire de l'élément span

Réponse 2. Les éléments div et span peuvent tous les deux servir de conteneurs pour des contenus différents. Cela est dû a fait que div est un élément block et span est un élément inline.

Chapitre précédent

Chapitre suivant