Nom de la formation: Utiliser Grid Layout CSS dans votre thème WordPress
Nom de code: CSS Grid Layout
Public: Auteurs, maquettistes ou Web Designers souhaitant se préparer à la prochaine révolution CSS.
Pré requis: Maîtrise des fondamentaux du CSS et du HTML.
Objectifs: Nous nous concentrerons sur toutes les approches modernes de mise en page avec les CSS. L’accent sera mis sur Grid Layout qui est sorti en mars 2017 et a déjà plus de 75% de support. Nous verrons comment l’implémenter dès aujourd’hui.
Formation: de 30 heures en 5 journées de 6 heures. Groupe de 5 personnes maximum.
Tarif: 1440€ HT / 1728€ TTC .Prise en charge AFDAS 100% ou OPCA.
Utiliser Grid Layout CSS dans votre thème WordPress
Plan de la formation
Les base du CSS3
Dans ce chapitre nous passerons en revue les nouveautés du CSS3. En utilisant des outils en ligne et en analysant des sites existants nous verrons comment personnaliser sa page web.
- Règles d’écriture du CSS
- Les principales propriétés
- Le box Model
- Mode d’intégration des CSS
- Unités de mesure
- Utilisation du CSS3 aujourd’hui
- Le responsive
- Les transitions CSS3
- Utiliser l’inspecteur de Chrome pour modifier et sauvegarder vos styles CSS en direct
- Utilisation de Supports avec les CSS avancés
Flexbox CSS3
Dans ce chapitre nous passerons les différentes valeurs associées à flex.
- Introduction sur Flex
- Réglages de Flexbox pour le parent
- Réglages de Flexbox pour les enfants
Les bases de Grid Layout CSS3
Dans ce chapitre nous verrons les bases de Grid Layout CSS.
- Introduction et ressources sur Grid Layout
- Concevoir les sites de demain avec Grid Layout et WordPress
- Déclaration et terminologie de Grid
- Construction de grilles simples
- Unité de mesure avec Grid Layout CSS
- Placer les éléments avec Grid Layout
Réglages avancés de Grid Layout CSS3
Dans ce chapitre nous verrons les réglages avancés de Grid Layout
- Utilisation des lignes nommées dans la grille
- Utilisation des zones nommées dans la grille
- Gestion du responsive avec Grid Layout
- Justifier et aligner depuis le parent
- Justifier et aligner les enfants directement
- Alignements automatiques dans la grille
- Utiliser Grid aujourd’hui avec @supports