article(s) dans votre panier VOIR

Apprendre la grille Pushpull du framework Materialize CSS

  • Vidéo 5 sur 20
  • 2h22 de formation
  • 20 leçons

Un contenu flash devrait s'afficher ici. Votre navigateur ne comporte pas de plugin flash, ou il ne s'est pas correctement initialisé.

Vous pouvez télécharger le plugin flash depuis le site d'Adobe à l'adresse suivante : http://get.adobe.com/flashplayer/.

Pour accéder à la suite de cette formation, vous devez vous abonner.
previous
summary
resume
next
play
La grille pushpull
00:00 / 03:50
HD
fullscreen
Je m’abonne
à partir de 16,6 € / mois
  • Visionnage en ligne
  • Accès illimité à toutes nos formations
OU
J'achète uniquement
la formation
39,90€
  • Téléchargement + VOD à vie
  • Accès uniquement à cette formation

Détails de la formation

Dans cette vidéo, Jean Bernard André vous apprend à maîtriser le Framework pour le Material Design de Materialize CSS en utilisant la grille Pushpull. Le but est de parvenir à intervertir les colonnes en fonction de la taille de l’écran. Pour ce faire, vous créez une Div de class Row à partir du code . Dans ce dernier, vous créez un intitulé pushpull push-pull. Vous saisissez ensuite le code div.col.pushpull*nombre de colonnes. Cela vous permet de créer des cases. En appuyant sur Entrée, vous avez automatiquement un code HTML qui est généré pour la mise en forme des colonnes. Une fois fait, vous indiquez leurs noms après l’annonce des classes. A part cela, vous donnez les tailles avants les intitulés push-pull. Vous appliquez la taille m pour les écrans moyens et pour les petits écrans, vous appliquez la taille s qui signifie small. Il vous est possible de saisir à la fois les deux tailles pour que l’interface puisse s’adapter aux différents device. Pour intervertir les cases dans les écrans de petite taille, vous disposez de deux fonctionnalités dans Materialize CSS. La fonction Push vous aide à pousser une case en fonction du nombre d’éléments que vous voulez obtenir. Quant à la fonction Pull, il permet de tirer une case. Pour utiliser ces fonctions, vous les saisissez après la taille et vous inscrivez le nombre de retrait que vous souhaitez. Pour conclure, vous savez maintenant comment changer votre interface en fonction de la taille de l’écran.