CATALOGUE Code & Data Formation XHTML/CSS Apprendre CSS 3 Intégration d'une Image de Fond Fixée dans l'Entête en HTML et CSS

Intégration d'une Image de Fond Fixée dans l'Entête en HTML et CSS

Fixer l'image de fond
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre CSS 3
Revoir le teaser Je m'abonne
4,5
Transcription

89,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis
4,5
89,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Les objectifs de cette vidéo sont :

  • Apprendre à intégrer une image de fond dans l'entête HTML.
  • Comprendre l'utilisation des propriétés CSS pour le style de fond.
  • Créer un effet de parallaxe en fixant l'image de fond.

Apprenez à intégrer une image de fond dans l'entête de votre page HTML et à la fixer pour un effet de parallaxe en explorant les propriétés background-image, background-size, et background-attachment.

Cette leçon détaillée vous guide à travers les étapes pour intégrer une image de fond dans l'entête de votre page HTML et la fixer pour créer un effet de parallaxe. Nous commençons par modifier le code HTML existant pour y ajouter des divs avec des classes spécifiques comme Banner et Overlay. Ceci nous permet d'appliquer des styles CSS pour l'image de fond et l'overlay avec transparence. Ensuite, nous abordons les propriétés CSS nécessaires comme background-repeat-no-repeat et background-size-cover pour s'assurer que l'image recouvre entièrement la zone désignée sans répétition. Nous ajustons également les positions sur les axes X et Y pour centrer l'image. Enfin, nous voyons comment fixer l'image en utilisant la propriété background-attachment: fixed, produisant ainsi un effet parallaxe pendant le défilement de la page.

Voir plus
Questions réponses
Quelle propriété CSS permet de fixer l'image de fond à une position?
La propriété CSS est background-attachment.
Comment centrer une image de fond sur les axes X et Y?
En utilisant les valeurs 50% pour background-position-x et background-position-y.
Quelle propriété CSS permet d'éviter la répétition de l'image de fond?
La propriété CSS est background-repeat-no-repeat.

Programme détaillé

4 commentaires
4,5
4 votes
5
4
3
2
1
pierre.hiroux
Il y a 10 mois
La formation est divisée en 90 modules sans lien entre eux et sans progression pédagogique. Il faut les réorganiser par thème pour donner plus de cohérence et donner de la progression pédagogique à la formation. Multiples fautes d'orthographe dans les textes.
henridjithat
Il y a 1 an
Très bonne formation, étant débutant j'ai beaucoup appris.
yvan.vogel
Il y a 2 ans
J'en suis arrivé au bout.. Un vrai marathon. Très longue formation, à mon avis c'est plutôt 30h de cours et non pas 15h.
Après c'est une formation hyper claire et détaillée. L'auteur a fait un panorama complêt sur le CSS3.
g.vanleynseele
Il y a 4 ans
Cours très clair et très bien expliqué! Par contre il manque la moitié des fichiers de travail !