CONNEXION
  • RetourJeux
    • Sorties
    • Hit Parade
    • Les + populaires
    • Les + attendus
    • Soluces
    • Tous les Jeux
    • Gaming
  • RetourActu Gaming
    • News
    • Astuces
    • Tests
    • Previews
    • Toute l'actu gaming
  • RetourBons plans
    • Bons plans
    • Bons plans Smartphone
    • Bons plans Hardware
    • Bons plans Image et Son
    • Bons plans Amazon
    • Bons plans Cdiscount
    • Bons plans Decathlon
    • Bons plans Fnac
    • Tous les Bons plans
  • RetourJVTech
    • Actus High-Tech
    • Intelligence Artificielle
    • Smartphones
    • Mobilité urbaine
    • Hardware
    • Image et son
    • Tutoriels
    • Tests produits High-Tech
    • Guides d'achat High-Tech
    • JVTech
  • RetourCulture
    • Actus Culture
    • Culture
  • RetourVidéos
    • A la une
    • Gaming Live
    • Vidéos Tests
    • Vidéos Previews
    • Gameplay
    • Trailers
    • Chroniques
    • Replay Web TV
    • Toutes les vidéos
  • RetourForums
    • Hardware PC
    • PS5
    • Switch 2
    • Xbox Series
    • Switch
    • Pokemon pocket
    • FC 25 Ultimate Team
    • League of Legends
    • Tous les Forums
  • PC
  • PS5
  • Xbox Series
  • Switch 2
  • PS4
  • One
  • Switch
  • iOS
  • Android
  • MMO
  • RPG
  • FPS
En ce moment Genshin Impact Valhalla Breath of the wild Animal Crossing GTA 5 Red dead 2
Liste des sujets

Créer une perspective en CSS/HTML

MrLeCoquet
MrLeCoquet
Niveau 10
28 novembre 2021 à 17:23:32

Bonjour,
Alors voila j'aimerai reproduire cette page internet:
https://culturenext.byspotify.com/en-US
Et comme vous pouvez le voir a gauche il y a des cubes en 3D et c'est ce que j'aimerai reproduire
Le problème c'est que quand je cherche sur internet je trouve seulement des articles pour créer une animation en 3d mais pas ce que je recerche

Magrozz
Magrozz
Niveau 7
28 novembre 2021 à 18:42:39

Tu peux utiliser "inspecter l'élément" pour essayer de comprendre comme un site est fait.
Pour le coup, ce n'est pas des cubes, mais chaque face est un "span" qui a subi des translations et des rotations.

https://developer.mozilla.org/fr/docs/Web/CSS/transform-function/translateZ()
https://developer.mozilla.org/fr/docs/Web/CSS/transform-function/rotate()

Magrozz
Magrozz
Niveau 7
28 novembre 2021 à 18:47:11

Je remarque aussi que tu as un souci pour chercher des réponses sur Google.
Tu as tapé quoi pour ton problème ? Tu peux simplement écrire "make cube in css" et tu auras des tonnes d'exemples.

https://3dtransforms.desandro.com/cube
https://dev.to/joeattardirdi/let-s-make-a-css-cube-1fed

MrLeCoquet
MrLeCoquet
Niveau 10
28 novembre 2021 à 19:22:03

Le 28 novembre 2021 à 18:42:39 :
Tu peux utiliser "inspecter l'élément" pour essayer de comprendre comme un site est fait.
Pour le coup, ce n'est pas des cubes, mais chaque face est un "span" qui a subi des translations et des rotations.

https://developer.mozilla.org/fr/docs/Web/CSS/transform-function/translateZ()
https://developer.mozilla.org/fr/docs/Web/CSS/transform-function/rotate()

Oui mais quand je fais inspecter l'element ca m'affiche seulement le HTML et pas le CSS ou alors je me trompe peut etre ?

Magrozz
Magrozz
Niveau 7
28 novembre 2021 à 21:02:35

Le 28 novembre 2021 à 19:22:03 :

Le 28 novembre 2021 à 18:42:39 :
Tu peux utiliser "inspecter l'élément" pour essayer de comprendre comme un site est fait.
Pour le coup, ce n'est pas des cubes, mais chaque face est un "span" qui a subi des translations et des rotations.

https://developer.mozilla.org/fr/docs/Web/CSS/transform-function/translateZ()
https://developer.mozilla.org/fr/docs/Web/CSS/transform-function/rotate()

Oui mais quand je fais inspecter l'element ca m'affiche seulement le HTML et pas le CSS ou alors je me trompe peut etre ?

Tu as aussi le CSS à droite dans "Styles".

https://www.e-monsite.com/pages/tutoriels/design-et-navigation/faire-ses-premiers-pas-en-css.html

Sous forums
  • Aide à l'achat Mac
  • Création de sites web
  • Internet
  • Macintosh
  • Création de Jeux
  • Linux
  • Programmation
  • Steam Deck
  • Hardware
La vidéo du moment