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 :

Lequel de ces éléments sert à créer une nouvelle ligne dans un tableau HTML ?

  1. L'élément table
  2. L'élément tr
  3. L'élément td

Réponse 2. L'élément table sert à définir le tableau HTML en soi tandis que l'élément td sert à définir les cellules d'un tableau.



Question n°2 :

Quelle propriété CSS utilise t-on pour "coller" les bordures d'un tableau ?

  1. La propriété border
  2. La propriété border-radius
  3. La propriété border-collapse

Réponse 3. On utilise la propriété CSS border-collapse et sa valeur "collapse" afin de coller les bordures des cellules de notre tableau entre elles.



Question n°3 :

Quel élément HTML sert à définir une ligne d'en tête pour notre tableau ?

  1. L'élément tr
  2. L'élément th
  3. L'élément thead

Réponse 2. L'élément th sert spécifiquement à définir une ligne d'en tête dans un tableau. L'élément thead, lui, est utiilsé pour structurer un tableau en le séparant en différentes parties.



Question n°4 :

Dans quel ordre écrit-on les éléments suivants généralement en HTML ?

  1. thead, tfoot puis tbody
  2. thead, tbody puis tfoot
  3. tbody, thead puis tfoot

Réponse 1. Lorsqu'on structure un tableau en HTML avec les éléments thead, tbody et tfoot il est considéré comme une bonne pratique d'écrire ces éléments dans l'ordre suivant : thead, tfoot puis tbody. Pas d'inquiétude, dans le rendu final, la navigateur saura qu'il faut afficher le contenu du tfoot après celui du tbody.



Question n°5 :

Comment faire en sorte qu'une cellule occupe l'espace de trois colonnes dans un tableau HTML ?

  1. En utilisant colspan = "3"
  2. En utilisant rowspan = "3"
  3. En crivant deux cellules vides après cette cellule dans notre tableau

Réponse 1. L'attribut colspan sert à fusionner plusieurs cellules d'une même ligne entre elles, ou encore à faire qu'une cellule occupe un espace en largeur de plusieurs colonnes.



Question n°6 :

Lequel de ces éléments HTML sert à ajouter une légende à un tableau HTML ?

  1. L'élément legend
  2. L'élément figcaption
  3. L'élément caption

Réponse 3. Pour ajouter une légende à un tableau, on utilisera un élément caption qu'on placera juste après la balise ouvrante de l'élément table.

Chapitre précédent

Chapitre suivant