Catégorie : Technique CSSPage 1 of 3
A garder en mémoire: la technique css grid https://dev.to/niorad/keeping-the-footer-at-the-bottom-with-css-grid-15mf
Un article qui explique comment downloader le fichier woff2 de la google font choisie et l’héberger sur votre propre server C’est ici
Tout est dans le titre (et l’illustration!) https://s.muz.li/MWNjYTY2Yjk4
… ça: ça va être cool … pour du responsive encore plus fluide!A étudier … et appliquer https://web.dev/min-max-clamp/
https://us.niemvuilaptrinh.com/article/top-87-web-design-tools-for-developer
Bon … ça semble peut-être inutile … mais peut rendre service.Surtout qu’il est vraiment personnalisable. Et rien que le nom… on a envie de l’installer! The Final Countdown
Une nouvelle méthode utilisant la propriété display:grid A tester mais me semble beaucoup plus approprié que la solution utilisant la propriété column-count: 4; qui est plutôt à utiliser…
Super technique utilisant la propriété column-count… à étudier et appliquer: https://w3bits.com/css-masonry/
Une propriété qui va nous permettre d’intégrer des images responsive… mais sûrement aussi pour d’autres occasions https://css-tricks.com/
Voici un petit script qui pourrait nous intéressé … https://michalsnik.github.io/aos/
Allez jeter un coup d’œil sur ce site: un webdesign très réussi: couleur, hiérarchie typographique, navigation et micro interactivité au top… https://www.simonsfoundation.org/
… pour poursuivre vos investigation dans l’animation onScroll… quelques scripts plus récents qui pourraient vous être utiles http://www.bestjquery.com/demo/jquery-animate-scroll-effects/
HTML-CSS-JAVASCRIPT: tout est expliqué… et en plus c’est joli C’est ici: internetingishard.com
Vous trouverez toutes les propriétés css, avec des exemples visuels ici: cssreference.io
Les medias queries: Pour faire ultra simple Min-Width: Refers to everything greater than or equal to the amount given. Max-Width: Refers to everything less than or equal to…
Comme pour les google fonts: google va peut-être fixer les « responsive breakpoints » standards. La page google L’analyse de webdesignerdepot
Un article très intéressant pour comprendre le formatage du texte
Je ne suis pas très fan des tutoriaux vidéo, mais celui-ci: ai eu pas mal de plaisir à le suivre CSS ANIMATIONS
Flex playground… pour tout comprendre Et encore mieux, avec tous les préfixages requis … à copier-coller … mais moins joli
A lire absolument html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; }
/* #### Mobile Phones Portrait #### */ @media screen and (max-device-width: 480px) and (orientation: portrait){ /* some CSS here */ } /* #### Mobile Phones Landscape #### */…
super pratique et bien plus léger qu’une image!!!!! CSS Gradient Generator (Attention: il semblerait que le copier/coller du code final ne fonctionne pas dans Firefox… Utilisez-donc de préférence…
