Coder des cartes tournantes 3D en CSS

Поділитися
Вставка
  • Опубліковано 26 лис 2024

КОМЕНТАРІ • 28

  • @EcoleduWeb
    @EcoleduWeb  Рік тому +1

    🎓 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/

  • @rickwarel9935
    @rickwarel9935 Місяць тому

    juste merci infiniment pour cette pépite.

  • @MyCodeDot
    @MyCodeDot 2 роки тому

    😯 Ho, le repeat(auto-fill, minmax(value, value)) une pépite pour le responsive

  • @EcoleduWeb
    @EcoleduWeb  2 роки тому +6

    Salut à tous, dites-moi si vous recevez bien le code source via la landing page.
    En effet j'ai tenté une nouvelle approche, vous pouvez recevoir le code source des vidéos en rentrant votre mail ici : www.le-designer-du-web.com/70gami6zn2
    Normalement ça déclenche un envoi automatique vers votre boite mail.
    Bonne journée ✌️

  • @maxime5811
    @maxime5811 2 роки тому +2

    Toujours aussi génial pour s'améliorer toutes les semaines ! Bravo !

  • @imino3713
    @imino3713 2 роки тому +1

    Les meilleures vidéo, tu m'aide beaucoup pour mes projets perso, un grand merci !

  • @arnaudmoyon6135
    @arnaudmoyon6135 2 роки тому

    Genial, Encore merci Enzo tes vidéos sont toujours super clair... Je kiff

  • @nackir4141
    @nackir4141 2 роки тому +1

    Excellent, tu es vraiment très "balaise", rapide comme l'éclair 😁 mais tu as le mérite de donner toutes les explications nécessaires.
    Et surtout, je t'ai connu par Udemy, tu es cohérent, dynamique et clair.
    mdr la vidéo de confirmation pour recevoir le code source mais mailchimp est à la traine par rapport à toi 🤣 toujours rien 5 min plus tard...
    Bonne continuation
    edit: le mail prend plus de 30s 😋 mais c'est ok 👍👍👍👍👍

    • @EcoleduWeb
      @EcoleduWeb  2 роки тому +1

      Merci pour ton soutien et ton retour, je vais essayer d’accélérer l’envoi avec Mailchimp pour les prochains projets 👌

  • @meyerben9749
    @meyerben9749 2 роки тому

    Toujours très instructif ! ! merci et le mail auto marche bien j'ai bien reçu le code.

  • @isa8383
    @isa8383 2 роки тому +1

    Vraiment très chouette, j'aime trop ces animations 👍😊. Merci Enzo 🙏😊

  • @quarkzfn
    @quarkzfn 2 роки тому +1

    Super vidéo ! Comment tu a fais pour mettre la petite flèche stp ?

  • @relaxation2811
    @relaxation2811 2 роки тому +1

    Merci pour tes vidéos 🙌🙌

    • @EcoleduWeb
      @EcoleduWeb  2 роки тому

      Merci pour ton soutien et avec plaisir !

  • @bf_osiris
    @bf_osiris 2 роки тому +2

    très bonne vidéo j'ai juste un problème avec le code: mes cartes ne se mettent pas en ligne mais elle se mettent en colonnes et je n'arrive pas à trouver d'où cela peut venir.
    Sinon rien à redire sur le tuto qui est clair, net et précis continue comme ça

  • @lagraph-carolinecelo4195
    @lagraph-carolinecelo4195 Рік тому

    Bonjour, Petite question : est ce que c'est intégrable facilement sur Wordpress ? merci d'avance

  • @jyhadbenyoussef221
    @jyhadbenyoussef221 2 роки тому

    Bonjour, tout d'abord merci pour tes videos! ensuite je voulais revenir sur la propriété backface-visibility : en effacant cette propriété je ne vois pas la difference de résultat ducoup je ne comprend pas son interet.. Est ce vraiment important de le mettre ? Idem avec les position relative des div .card-wrapper et .card
    Merci encore pour les vidéos que tu fais 🤙👍

  • @jamilaabela6013
    @jamilaabela6013 2 роки тому +1

    Peut on faire ça avec des image du coup ?

  • @joelkanyembo7872
    @joelkanyembo7872 2 роки тому

    merci enzo

  • @tenchigreed
    @tenchigreed 2 роки тому

    Super interessant

  • @leoleroux3054
    @leoleroux3054 2 роки тому

    je prends rendez-vous *

  • @mamadousy9107
    @mamadousy9107 Рік тому

    bonour jai fait exactement comme vous mais sa ne marche pas perso je suis un debutant

  • @benaliamine2235
    @benaliamine2235 Рік тому

    Salut, y'a que moi qui ne trouve pas le code source en description 🥲

    • @benaliamine2235
      @benaliamine2235 Рік тому

      Je l'ai trouvé merci beaucoup pour ta vidéo 🫶

  • @CirTap
    @CirTap 2 роки тому

    Bien copié, mais permets-moi de faire quelques remarques techniques... 😇
    J'aime le fait que tu utilises :nth-child(). Ce groupe de sélecteurs n'est pas assez promu et enseigné !
    Tu aurais pu utiliser `:first-child` et limiter `display:block` à ce premier `span`. Le deuxième aurait été automatiquement déplacé sur une nouvelle ligne. Globalement, moins de CSS, même si ce n'est qu'un bref exemple de code. Ces choses-là s'accumulent :-)
    À propos de gaspillage : il est très dommage et pas particulièrement efficace que tu charges pour *UNE* simple flèche un énorme fichier CSS (110 kb minifié !) plus sa grosse police de caractères (70-100 kb) de FontAwesome -- alors que cela aurait pu être fait avec un simple symbole HTML (ou Unicode) et moins de balisage : → / ⇒
    Et la performance est aussi garantie meilleure ! En HTML, cela représente 12 octets, contre environ 200 000 pour le même effet visuel avec FontAwesome. 🤯
    Des flèche Unicode: www.w3schools.com/charsets/ref_utf_arrows.asp
    Les propriétés avec préfixe (-webkit-) doivent également être notées *avant* les propriétés standard. Si la prochaine version (16?) de Safari utilise enfin le standard CSS (identique), tout continuera à fonctionner sans erreur.
    Tous les autres navigateurs le font sans préfixe depuis 2014.
    Au lieu de `div.card-font` pour le prix, un autre `p` serait plus sémantique. Mettre la flèche (&rArr ;) et utiliser "display:flex" : c'est fait.
    p.class-price { display:flex }
    p.class-price > i { margin-inline-start:auto }
    ... et oui : le français n'est pas ma langue maternelle :-)