Logo du langage CSS3

Css et les placements, grid flex et float

Css est le langage permettant de styliser des pages web, mais ce langage permet également de placer les différents éléments d'une page. Cette formation vous apprendra à positionner vos éléments grâce a grid, flex et float, qui sont des propriétés de mise en page propre à Css

Programme

Découverte de Grid Layout

  • Démonstration initiale
  • Le Flux dans la grille : implicite et explicite
  • Propriétés de flux automatique
  • Unités et valeurs de Grid Layout
  • Placer explicitement

Aligner dans Grid Layout

  • Alignement des l'ensemble des cellules
  • Alignement général des Grid Items
  • Alignement individuel d'un Grid Item

Répétition de motifs

  • Fonction repeat()
  • Les valeurs auto-fill et auto-fit
  • La combinaison repeat() + auto-fit + minmax()

Fonctionnalités avancées

  • Modification de l'ordre d'affichage
  • Superposition d'éléments
  • Valeurs négatives de Grid Line
  • Construction d'un template responsive

Support de Grid Layout

    • Tableau de support navigateurs
    • Ressources : Grid Polyfill et Gridbugs
    • Amélioration progressive
    • Le "cas" IE
    • Les stratégies de mise en production

Informations pratiques

À qui s'adresse la formation

Intégrateurs, développeurs front-end et webdesigners utilisant au quotidien HTML et CSS et souhaitant parfaire leurs compétences et découvrir les secrets et techniques avancées pour un usage en production.

Organisation

Jour 1 / Etude de float et techniques simples

Jour 2 / Etude de flex

Jour 3 / Etude des grid et cas pratiques

Pré-requis

Être très familier avec les langages HTML et CSS.

Objectifs

A l’issu de la formation, les élèves seront capables de :


- À la fin de la formation, vous êtes capable de concevoir des pages et applications web avec Grid Layout et Flex.

Prochaines dates disponibles

27/03

Tarifs

Pour 1 personne :

350€ / jour

À partir de 5 personnes :

300€ / jour

Pour une classe entière :

Ces formations pourraient vous intéresser