CATALOGUE Code & Data Formation XHTML/CSS Apprendre CSS 3 Application de Flexbox pour la Mise en Page en CSS

Application de Flexbox pour la Mise en Page en CSS

La page contact
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre CSS 3
Revoir le teaser Je m'abonne
4,5
Transcription
Cette leçon fait partie de la formation
89,00€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm
DescriptionProgrammeAvis
4,5
Cette leçon fait partie de la formation
89,00€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Mise en Page de la Section Contact et Formulaire

Objectifs

Les objectifs de cette vidéo sont de :

  • Comprendre l'application des propriétés Flexbox en CSS
  • Savoir structurer et styliser une page de contact
  • Maîtriser les techniques de mise en page responsive

Résumé

Apprenez à utiliser Flexbox en CSS pour structurer des pages web, y compris des formulaires et sections de contacts.

Description

Cette leçon couvre l'application du Flexbox en CSS pour organiser et styliser diverses sections d'une page web, spécifiquement une page de contact et un formulaire. Vous apprendrez à :

  • Reprendre et adapter des éléments de la page d'accueil
  • Utiliser des classes CSS pour dimensionner des boîtes
  • Appliquer des propriétés Flexbox telles que flex-basis et flex-grow
  • Styler des formulaires avec un background-color, des padding et des margin
  • Positionner des éléments côte à côte pour une mise en page propre et responsive

Avec des instructions pas à pas et des astuces pour trouver les bons design patterns, vous serez en mesure d'améliorer significativement la mise en page de vos pages web.

Voir plus

Questions fréquentes

Comment peut-on aligner des éléments côte à côte en utilisant Flexbox ?
Pour aligner des éléments côte à côte, on applique la propriété CSS display: flex sur l'élément parent et on utilise les propriétés flex sur les éléments enfants.
Quelle propriété Flexbox est utilisée pour spécifier la taille de flexion initiale des éléments ?
La propriété flex-basis est utilisée pour spécifier la taille initiale de flexion des éléments avant que l'espace restant soit distribué.
Comment pouvons-nous centrer un formulaire en utilisant Flexbox ?
Pour centrer un formulaire, vous pouvez utiliser justify-content: center et align-items: center sur l'élément parent ayant display: flex.

Programme détaillé

4 commentaires
4,5
4 votes
5
4
3
2
1
pierre.hiroux
Il y a 1 an
La formation est divisée en 90 modules sans lien entre eux et sans progression pédagogique. Il faut les réorganiser par thème pour donner plus de cohérence et donner de la progression pédagogique à la formation. Multiples fautes d'orthographe dans les textes.
henridjithat
Il y a 2 ans
Très bonne formation, étant débutant j'ai beaucoup appris.
yvan.vogel
Il y a 2 ans
J'en suis arrivé au bout.. Un vrai marathon. Très longue formation, à mon avis c'est plutôt 30h de cours et non pas 15h.
Après c'est une formation hyper claire et détaillée. L'auteur a fait un panorama complêt sur le CSS3.
g.vanleynseele
Il y a 4 ans
Cours très clair et très bien expliqué! Par contre il manque la moitié des fichiers de travail !