Mdcss est un simple outils permettant de générer facilement un guide des styles css.
Nous allons voir comment l'utiliser sur un cas simple.
Dans cet exemple, j'utiliserai un fichier gulpfile.
Pour commencer, il faut l'installer via npm ou yarn.
Les archives de l'auteur : Cedric DELANNOY
Sticky sidebar
Les flex-items
Flexbox est une valeur de la propriété css display. J'ai pu en faire usage sur des projets requérant une compatibilité ie 11 minimum pour profiter des avantages qu'elle procure par rapport aux display: table, display: inline-block ou float: left lorsqu'il s'agit de mettre deux blocs côte à côte (pas de perte de flux, pas d'espace entre les deux blocs).
Avant de parler en détail des flex-items, je vais m'interesser rapidement au flex-container à qui on affecte le display flex. En effet, on donne à un container la valeur flex sur son display, puis une série de propriétés que je vais rapidement énumerer et qui agissent n'ont pas sur lui même, mais sur ses enfants directs (appellé flex-items).
Initiation au canvas
Nous allons voir dans cet article un exemple d'utilisation de la balise canvas dans le cadre d'une animation sur un visuel.
L'animation consistera à faire disparaître au survol l'image bloc par bloc avec une animation d'opacité et de translation vers le haut.