Quand CSS nous en fait voir de toutes les couleurs
(En cours d'écriture)
La gestion des couleurs CSS évolue beaucoup ces dernières années. Nous assistons à une amélioration spectaculaire de la technologie d'affichage, notamment avec l'apparition des écrans à plus haute résolution.
Les requêtes de style et de conteneur (container queries) en CSS
Il ne faut pas confondre les requêtes multimédias (media queries) qui permettent de changer l’état d’un élément en fonction de la taille du viewport (la fenêtre du navigateur) et les requêtes de conteneur dont la fonction est de changer l’état d'un élément selon la taille de son conteneur...
Les sous-grilles en CSS
Ajoutée dans le deuxième module de CSS grid layout, la valeur subgrid s'avère être une fonctionnalité très pratique dans une mise en page moderne...
Le format d'image en CSS
Dans la conception web, la notion de format d'image représente la manière dont une image doit être redimensionnée proportionnellement à sa largeur ainsi que sa hauteur...
Ils ont tué position absolute !
Avec l'arrivée des grilles CSS, vous allez constater que le positionnement en CSS connaît une vraie révolution. En effet, le modèle Grid layout possède des propriétés qui permettent de positionner facilement les éléments...
Les dégradés coniques (conic-gradient) CSS
Similaire à un dégradé radial, le dégradé conique est circulaire et utilise le centre de l'élément comme point source des arrêts de couleur...
CSS Scroll Snap module
Ce module introduit les positions d'accroche lors du défilement garantissant ainsi la position sur laquelle on arrive après avoir fait défiler du contenu...
Les propriétés CSS personnalisées
Avec les propriétés CSS personnalisées, il vous sera possible de mieux gérer votre code, de l'alléger mais surtout celui-ci gagnera en lisibilité et en maintenabilité...
Sticky : une valeur pot de colle
Le positionnement collant va permettre à un élément de rester visible pendant que l'utilisateur fait défiler la page ou le conteneur dans lequel se trouve l'élément collant...
L'Art de la mise en page avec CSS
Tandis que les formes CSS permettent d'encapsuler un contenu autour de chemins, les exclusions quant à elles ont été conçues pour permettre à un contenu d'envelopper un élément sans que celui-ci ne soit retiré du flux...
Masque et découpage en CSS
Alors que l'écrêtage (ou découpage) définit une région de rognage et coupe par conséquent tout ce qui ne fait pas partie de la région, le masquage va, quant à lui, filtrer les parties visibles d'un élément...
CSS morphing
Le morphing en CSS consiste à animer des formes qui simulent une transformation. Il existe plusieurs façons de faire du morphing en CSS...
Les propriétés d'images en CSS
La propriété CSS object-fit, permet de définir la façon dont le contenu d'un élément remplacé doit s'adapter à son élément parent tandis que la propriété object-position détermine le positionnement de l'élément remplacé qui se trouve dans sa boite...
Mode de fusion d'images en CSS
Avec CSS, il est de plus en plus facile de se passer d'éditeurs graphiques. Vous pouvez donc, avec CSS, appliquer des couches sur des images...
Les filtres CSS
Les filtres CSS permettent d'appliquer des effets sur des images directement dans votre document HTML. Plus besoin de passer par un éditeur graphique....
HTML5 Web components
Les composants web permettent de créer des balises HTML personnalisées, réutilisables et séparées de l'application web principale. L'idée n'est pas nouvelle, puisque déjà la librarie JQuery avec ses plugins allaient en ce sens...
Elément HTML5 canvas
L'élément canvas est une spécificité HTML5 qui, au travers de la balise du même nom : <canvas>, permet de créer une aire de dessin. Couplé avec JavaScript, il est alors possible de générer des formes (plus ou moins complexes) à l'intérieur de cette aire et de les animer...
Le format AMP (Accelerated Mobile Page)
AMP pour Accelerated Mobile Pages est un format open source lancé en 2016, entre autres, par Google. Il vise avant tout à charger les pages mobiles le plus rapidement possible mais aussi à améliorer l'expérience utilisateur. Exit le superflux, place à l'essentiel...
Eléments de formulaire HTML5
HTML5 a apporté de nombreux nouveaux éléments dans les formulaires, plus accessibles et surtout proposant de nouvelles fonctionnalités. Nous verrons également les nouveaux attributs. Vous l'aurez compris, dans cet article, nous n'aborderons pas les champs déjà existants.
Eléments HTML5 progress et meter
L'élément progress indique l'état d'avancement d'une tâche représenté par une barre de progression, tandis que l'élément meter représente une jauge qui va mesurer une valeur comprise entre un minimum et un maximum. Celui-ci est surtout destiné à indiquer un état, stable ou pouvant évoluer, au cours du temps...
Web Animations API (WAAPI)
Cette API JavaScript permet de générer du contenu animé et de le contrôler en se basant sur les fonctionnalités de CSS et de SVG. Elle propose des animations puissantes et performantes...
Les nouveautés SVG2
Rapide présentation de la deuxième version de SVG qui verra peut-être le jour. Les fonctionnalités listées ci-dessous pourront faire l'objet d'un retrait, en voici quelque unes.
SVG morphing
Tout comme avec CSS, le morphing SVG consiste à animer des formes afin d'obtenir une transformation en manipulant les coordonnées des points constituant des éléments graphique SVG...