Les erreurs de débutant en "responsive".
ฝัง
- เผยแพร่เมื่อ 5 ต.ค. 2024
- 🎓 Tous mes cours sur l'École du Web (pour les obtenir tous d'un coup) : www.ecole-du-w...
🎁 Tous mes cours sur UDEMY : liste-des-cour...
🚀 1 Cours gratuit en t'abonnant à ma newsletter :
www.le-designe...
Le lien du Discord : / discord
Ma chaine en Anglais :
/ @thewebschool
Abonne-toi à ma chaîne :
/ @ecoleduweb
Suis-moi sur Twitter :
/ ledesignerduweb
Si tu veux que je fasse des vidéos sur certains sujets dis le moi!
-----------------------------------------------------------------------------------------
![[LIVE] : ONE ลุมพินี 82 วันนี้!! คู่เอก | ยอดไอคิว vs อับดัลลาห์](http://i.ytimg.com/vi/hSsyTl_9bqs/mqdefault.jpg)
🎓 Tous mes cours sur l'École du Web (pour les obtenir tous d'un coup) : www.ecole-du-web.net/
🎁 Tous mes cours sur UDEMY : liste-des-cours.com/
Pour les medias queries :
Max-width(1000px) = inférieur à 1000px
Min-width(1000px) = supérieur à 1000px
(Pour retenir plus facilement)
J’ai passé la moitié de mon après-midi à essayer d’adapter un page. Et là la réponse à toute mes questions. MERCI BEAUCOUP 🤩
Vous êtes vraiment un grand mon Designer, vos videos sont tjrs d'une très grende importance et précisions
Votre vidéo est d'une qualité EXCELLENTE ! Merci beaucoup pour ce partage !
Merci pour tes vidéo de design web nous parle vraiment et nous encourage à se perfection dedans. vraiment chapeau!
Encore une belle leçon propre très bien expliquer c'est génial
Bonjour Professeur, super super et vraiment super, merci infiniment pour ce tuto.
Merci beaucoup pour cette vidéo !! Je suis débutante et je me suis toujours cassée la tête là-dessus. Je me suis même sentie obligée d'apprendre bootstrap pour faire que mon site soit responsive alors que finalement j'en ai pas besoin à priori. C'est clair et bien expliqué. J'ai encore un peu de mal avec la subtilité des média queries mais je vais m'entrainer.
Trop trop bien expliqué :)
merci pour tout vos tutos
Super intéressant 🙏
trop cool la vidéo, super simple pour comprendre
merci pour cette vidéo ! de l'or pur :D
J'avoue c'est vrai , j'arrive pas à responsiver mes pages 😶😶😶
Responsiver ahaha
J'arrive avec un train de retard. Mais merci pour ce petit tour de responsive.
Salut Enzo. Comme d'hab au top. Dis moi pourrais tu faire une video sur le XML et comment on peut s'en servir en js. Il y a rien en fr beaucoup de choses en anglais......c'est une suggestion...Continue comme çà :)
Merci pour cette vidéo. Toujours super. J'aimerais savoir comment choisir et utiliser les bonnes mesures de dimensions : px, em, rem, %, fr pour le responsive.
Ça dépend vraiment des utilisations, j'ai fait quelques vidéos dessus déjà, notamment "la technique du 62.5%" ;).
Très bonne vidéo.
Il faut s'habituer à ces paramètres, j'avais bien compris le css grid en le faisant via mon cours et en réessayant, impossible de mettre sur une seule colonne les items pour le mobile alors que j'ai refait pareil (enfin ce que je crois bien entendu).
Le boss👊
😎🚀
En tous cas ce exceptionnel
Et pour les vh, vw également ?
Le CSS est presqu'un langage de programmation
salut, y'a encore du chemin ^^ mais il a quelques subtilités qui font cogiter effectivement ^^...bien plus que le HTML.
par contre, dire qu'on peut se passer des media queries est une erreur qui va embrouiller pas mal de monde. ne pas les utiliser, c'est perdre pas mal de controle et là, ca marchait bien car sont des exemples tres simples mais dés que le design est un peu plus complexe, c'est pas possible de s'en passer.
mais du coup pas besoin des media queries ? vu que y'a flexbox et grid ? ou faut ajouter les media queries meme avec les flexbox et grid ?
Il n'y a pas de réponse exacte à cette question, tout dépend du code, l'utilisation de Flex & Grid peut permettre de réduire l'utilisation des medias queries, mais ça peut toujours être utile d'en utiliser avec :)
@@EcoleduWeb merci beaucoup :)
Merci pr le tuto!
Juste un détail de débutant 🤔
Je comprend pas la syntaxe
( margin : 100px auto 0;) …
100px en haut, auto à gauche et à droite et 0 en bas
Perso avant le responsive je m'en occupait pas plus que ça vu que j'utilisait Bootstrap et que ça se gérait plus ou moins tout seul mais depuis que j'ai abandonné celui-ci pour tout coder avec Css-grid et flexbox je passe pas mal plus de temps sur le responsive et j'avoue que c'est déstabilisant d'utiliser et d'anticiper les média queries xD
en démarrant mobile-first, les mediaqueries restent hyper simples à gérer
Voici les tailles de base pour avoir un responsive quasi parfait !
Normalement vous devrez vous en sortir qu'avec ses tailles :)
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 1024px) {
}
@media screen and (max-width: 768px) {
}
@media screen and (max-width: 480px) {
}
pas forcément ; perso je code tout à 320w ; puis je met 2 à 4 mediaquery au dessus selon comment est fait mon site, sans règle pré-établie (dernier quand même généralement à1400w, les écrans ont grandi!) . Et je rajoute souvent un mediaquery à 260w-320w pour rendre lisible à minima mon site sur les petits tel
@@kaak2270 Normalement si ton site est correctement coder, mes tailles devrait amplement te suffire. 1024px pour les tablettes, 480px pour les petits écrans et le reste pour ajuster ;)
Après il peut y avoir des moment ou tu doit rajouter des media query selon comment ça réagit en réduisant
@@SkyInfinity en fait comme tu viens de le dire, ca dépends ... du site ! Donc absolument pas besoin de chiffre rigides ! (sauf pour les limites qu'on se fixe en taille max et min d'écran - encore que même ca, ça va bouger avec les années et les tailles d'écran qui augmentent...).
Bref, il suffit de se servir de l'inspecteur et de ses yeux, pour créer des breakpoint à la volée selon son site ; et en mobile first ca prend peu de temps et n’est jamais trop un problème
@@kaak2270 Oui c'est sûr, mais vaut mieux penser sa structure dés le début car après ça peut être vraiment fouillis avec des breakpoints qui n'ont aucun sens, genre un breakpoint pour une seule div par exemple ^^
Les opérateurs logiques fonctionnent que pour media ?