CATALOGUE Code & Data Formation XHTML/CSS Apprendre HTML5 et CSS3 / Part 3 Création de Polaroids en HTML et CSS

Création de Polaroids en HTML et CSS

Mise en page Polaroid
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre HTML5 et CSS3 / Part 3
Revoir le teaser Je m'abonne
3,0
Transcription
59,90€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm
DescriptionProgrammeAvis
3,0
59,90€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Introduction à la création de polaroids

Objectifs

Les objectifs de cette vidéo sont de:

  • Comprendre comment structurer des polaroids en HTML
  • Appliquer des styles CSS pour créer des effets polaroids
  • Utiliser des polices personnalisées téléchargées en ligne
  • Assurer la compatibilité des styles sur différents navigateurs

Résumé

Découvrez comment créer des effets polaroids avec HTML et CSS, étape par étape.

Description

Dans cette leçon, nous allons apprendre à créer des polaroids en utilisant HTML et CSS. Nous commencerons par organiser nos éléments HTML, suivis de la stylisation avec CSS. Vous apprendrez à insérer des images dans des éléments div afin de leur donner une apparence polaroid, à les positionner et à appliquer des ombres pour un effet réaliste. Nous aborderons également l'incorporation de polices spécifiques, téléchargées depuis des plateformes comme FontSquirrel. Enfin, nous testerons et ajusterons notre travail pour nous assurer qu'il fonctionne correctement sur différents navigateurs.

Voir plus

Questions - réponses

Pourquoi devons-nous utiliser des balises <div> pour chaque image?
Les balises
permettent de créer des conteneurs pour chaque image, ce qui facilite l'application de styles et de mise en page spécifique à chaque polaroid.
Quelle est l'importance du positionnement absolu dans cette leçon?
Le positionnement absolu est utilisé pour placer précisément les polaroids les uns par rapport aux autres et par rapport à leur conteneur.
Comment assurer la compatibilité avec différents navigateurs pour les effets CSS?
Nous utilisons des préfixes spécifiques à chaque navigateur (comme -webkit-, -moz-, -o-) pour les propriétés CSS afin de garantir que les effets fonctionnent sur tous les navigateurs.

Programme détaillé

1 commentaire
3,0
1 vote
5
4
3
2
1
Cicine
Il y a 1 year
Commentaire
Dans la séquence slide auto, pas d'explication sur le 12% du slider auto; quelle est l'origine de ce chiffre? pas d'explication me bloque. Je suis obligée d'aller voir une autre plateforme qui présente le slide auto.
Dommage.