Outils pour utilisateurs

Outils du site


issue91:command_conquer

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision
Révision précédente
issue91:command_conquer [2015/02/25 09:08] – [3] auntieeissue91:command_conquer [2015/02/25 14:07] (Version actuelle) auntiee
Ligne 19: Ligne 19:
 Jeet - C'est quoi ? Jeet - C'est quoi ?
  
-Jeet est ce qu'on appelle un « Ratio Grid ». Il propose des fonctions SASS ou Stylus pour générer le CSS nécessaire pour créer des colonnes sur n'importe quel élément. Le site Web cité dans « Pour aller plus loin » (ci-dessous) décrit de façon excellent exactement ce qu'est Jeet. Je vais donc plutôt me concentrer sur un exemple de la façon dont il diffère de Fondation.+Jeet est ce qu'on appelle un « Ratio Grid ». Il propose des fonctions SASS ou Stylus pour générer le CSS nécessaire pour créer des colonnes sur n'importe quel élément. Le site Web cité dans « Pour aller plus loin » (ci-dessous) décrit de façon excellent exactement ce qu'est Jeet. Je vais donc plutôt me concentrer sur un exemple de la façon dont il diffère de Foundation.
  
 ====== 2 ====== ====== 2 ======
Ligne 47: Ligne 47:
 L'exemple Emmet L'exemple Emmet
  
-Pour l'illustration des différences entre Jeet et Fondation, je vais utiliser les trois mêmes déclarations dans Emmet, et travailler à partir de là. Après chaque déclaration, je vais utiliser TAB et laisser Emmet compléter, puis passer à la suivante. Les voici :+Pour l'illustration des différences entre Jeet et Foundation, je vais utiliser les trois mêmes déclarations dans Emmet, et travailler à partir de là. Après chaque déclaration, je vais utiliser TAB et laisser Emmet compléter, puis passer à la suivante. Les voici :
  
 html:5 html:5
Ligne 76: Ligne 76:
 L'exemple L'exemple
  
-En supposant que vous vouliez créer une mise en page sur deux colonnes qui s'étend sur toute la largeur de la page Web, vous auriez besoin de faire ce qui suit pour Fondation :+En supposant que vous vouliez créer une mise en page sur deux colonnes qui s'étend sur toute la largeur de la page Web, vous auriez besoin de faire ce qui suit pour Foundation :
 • Créer un div avec la classe « row » dans les balises du corps. • Créer un div avec la classe « row » dans les balises du corps.
 • Créer un style supplémentaire pour étendre la largeur de la ligne à 100 %. • Créer un style supplémentaire pour étendre la largeur de la ligne à 100 %.
Ligne 111: Ligne 111:
 Conclusion Conclusion
  
-Comme vous pouvez le voir, la configuration des colonnes se passe dans une feuille de style, ce qui signifie que vous pouvez vous concentrer sur la création d'une structure de base html, et alors seulement la modifier pour ajouter des styles supplémentaires dont vous pourriez avoir besoin. Vous n'êtes pas obligé d'ajuster les colonnes en modifiant les balises d'éléments, ce qui est génial quand vous travaillez avec un CMS et ne pourrez pas nécessairement modifier facilement un fichier HTML pour effectuer vos changements. Un autre avantage est que le fichier CSS compilé contient littéralement uniquement les styles que vous utilisez. Alors que Fondation vous laisse choisir différents modules à compiler, il y a très souvent une grande quantité de code inutile.+Comme vous pouvez le voir, la configuration des colonnes se passe dans une feuille de style, ce qui signifie que vous pouvez vous concentrer sur la création d'une structure de base html, puis la modifier uniquement pour ajouter des styles supplémentaires au besoin. Vous n'êtes pas obligé d'ajuster les colonnes en modifiant les balises d'éléments, ce qui est génial quand vous travaillez avec un CMS et ne pourrez pas nécessairement modifier facilement un fichier HTML pour effectuer vos changements. Un autre avantage est que le fichier CSS compilé contient littéralement uniquement les styles que vous utilisez. Alors que Foundation vous laisse choisir différents modules à compiler, il y a très souvent une grande quantité de code inutile.
  
-Espérons que cela va aider à porter Jeet à l'attention de ceux qui débutent, afin qu'ils puissent se concentrer davantage sur la bonne mise en forme et la concision plutôt que se conformer au format de Fondation Zurb. Cela ne veut pas dire que Fondation n'est pas utile pour certains aspects, car il offre plus que juste une grille (par exemple les styles prédéfinis pour les boutons ou menus), et il peut facilement être mélangé avec la grille Jeet.+Espérons que cela va aider à porter Jeet à l'attention de ceux qui débutent, afin qu'ils puissent se concentrer davantage sur la bonne mise en forme et la concision plutôt que se conformer au format de la Fondation Zurb. Cela ne veut pas dire que Foundation n'est pas utile pour certains aspects, car il offre plus que juste une grille (par exemple les styles prédéfinis pour les boutons ou menus), et il peut facilement être mélangé avec la grille Jeet.
  
 ====== 6 ====== ====== 6 ======
Ligne 134: Ligne 134:
 Pour aller plus loin : Pour aller plus loin :
  
-http://jeet.gs/ - Le framework Jeet.+http://jeet.gs/ - Le Framework Jeet.
 https://github.com/mojotech/jeet/tree/master/stylus - Le dépôt github pour Jeet Framework Stylus avec des projets stylus utiles (listés dans Protips). https://github.com/mojotech/jeet/tree/master/stylus - Le dépôt github pour Jeet Framework Stylus avec des projets stylus utiles (listés dans Protips).
 http://emmet.io/ - Le site Emmet. http://emmet.io/ - Le site Emmet.
 https://github.com/lswest/FCM91 - Dépôt github avec des exemples. https://github.com/lswest/FCM91 - Dépôt github avec des exemples.
  
issue91/command_conquer.1424851716.txt.gz · Dernière modification : 2015/02/25 09:08 de auntiee