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. 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 touche t-on aux "limites du HTML" avec les formulaires ?

Le HTML va nous permettre de créer notre formulaire en soi, c'est-à-dire les différents champs permettant aux utilisateurs de nous envoyer des données. Cependant, nous n'allons pouvoir ni traiter ni enregistrer les données envoyées en HTML.



Question n°2 :

Quelle précaution doit on prendre lorsqu'on crée un formulaire ?

Il faut toujours se méfier des données qui sont envoyées par les utilisateurs : vous ne devez jamais vous attendre à recevoir des données conformes. Vous devez donc sécuriser vos formulaires puis effectuer des tests pour nettoyer et valider les données reçues en PHP par exemple.



Question n°3 :

Lequel de ces éléments HTML sert à définir un formulaire ?

  1. L'élément form
  2. L'élément input
  3. L'élément label

Réponse 1. L'élément form sert à définir un formulaire en HTML.



Question n°4 :

L'élément form doit obligatoirement être accompagné...

  1. D'un attribut method
  2. D'un attribut action
  3. De deux attributs method et action

Réponse 3. Pour qu'on formulaire fonctionne correctement, vous devez préciser deux attributs method et action dans la balise ouvrante de votre élément form.



Question n°5 :

Si je demande un mot de passe dans mon formulaire, j'utiliserai plutôt...

  1. La valeur get de l'attribut method
  2. La valeur post de l'attribut method
  3. Aucune de ces deux valeurs

Réponse 2. En utilisant la valeur get de l'attribut method, les données envoyées transiteront via l'URL et de façon visible, ce que nous voulons absolument éviter lorsqu'on demande des informations sensibles dans un formulaire.



Question n°6 :

Lequel de ces éléments sert à créer un champ de type "date" dans un formulaire ?

  1. L'élément input
  2. L'élément date
  3. L'élément select

Réponse 1. Nous utiliserons l'élément input avec son attribut type et sa valeur date pour créer un champ de type date dans un formulaire.



Question n°7 :

Lequel de ces attributs sert à pré-cocher une case ?

  1. L'attribut selected
  2. L'attribut autocomplete
  3. L'attribut checked

Réponse 3. L'attribut selected va permettre de pré-sélectionner une option dans une liste d'options tandis que autocomplete va permettre l'auto-complétion d'un champ de formulaire.



Question n°8 :

A quoi sert l'attribut placeholder ?

L'attribut placeholder sert à donner des indications sur la nature des informations attendues en affichant un texte à titre d'exemple à l'intérieur d'un champ de formulaire (si celui-ci est une zone de saisie évidemment).



Question n°9 :

On va utiliser l'élément fieldset pour...

  1. Donner un titre à notre formulaire
  2. Donner un titre à une partie de notre formulaire
  3. Créer des parties dans notre formulaire

Réponse 3. L'attribut fieldset sert à créer des sections dans un formulaire. Pour ajouter un titre à chaque section, nous utiliserons l'élément legend.

Chapitre précédent

Chapitre suivant