14,00

Tuto Intégration d'une Landing page Responsive avec HTML, CSS, jQuery

14,00

  • Une formation vidéo de 1h53m
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Fichiers sources inclus
  • Découvrez pourquoi vous former avec Tuto.com
Intégration d'une Landing page Responsive

ajouter ce cours aux favoris retirer ce cours des favoris

Dans cette formation HTML & CSS en vidéo, je vous propose de découvrir ensemble comment intégrer une maquette de Landing Page tout en restant Responsive tablette & mobile.

La maquette graphique que nous allons intégrer est fournie avec la formation.
Si vous souhaitez apprendre à designer cette Landing page sur le logiciel Figma, je vous invite à suivre le premier épisode disponible sur tuto.com

Aucun Framework tel que Bootstrap ne sera utilisé.

Nous utiliserons seulement les langages HTML & CSS ainsi que des techniques modernes d'intégration telles que la disposition des blocs grâce aux Flexbox ou bien l'utilisation des variables pour stocker les différents codes couleurs. Enfin, la librairie JQuery nous sera utile pour créer le menu en version mobile.

Les fichiers sources sont inclus avec le tuto : la maquette Figma, les fichiers de départ & l'intégration finale obtenue à la fin de la formation.
N'hésitez pas à me soumettre des questions dans le salon d'entraide si vous rencontrez des difficultés pendant ou après le visionnage de la vidéo.
Bon tuto !

Table des matières de cette formation HTML, CSS, jQuery (durée : 1h53m)

    • Introduction & tour d'horizon des fichiers fournis gratuit 00:03:49
    • Structure HTML pour le Header 00:05:39
    • Mise en place du CSS global : variables, body, liens, titres... 00:11:51
    • Appliquer le CSS au Header pour le styliser comme sur la maquette 00:10:17
    • Structure HTML de la partie gauche de la Landing Page 00:08:03
    • Appliquer le CSS sur la partie gauche de la Landing Page 00:24:09
    • Structure HTML de la partie droite de la Landing Page 00:03:37
    • Appliquer le CSS sur la partie droite de la Landing Page 00:10:48
    • Ajouter un effet de Blur rose sur le fond du site uniquement en CSS 00:05:25
    • Adapter le site en Responsive grâce aux media queries 00:14:25
    • Mise en place du menu en version mobile 00:08:00
    • Apparition du menu avec jQuery & Conclusion 00:07:17



Formateur : Adrien Gazaix

Adrien Gazaix a publié 198 tutoriels et obtenu une note moyenne de 4,8/5 sur 58 107 tutoriels vendus. Adrien Gazaix est un formateur certifié tuto.com. Voir les autres formations de Adrien Gazaix

5,0
note moyenne

1
avis laissé
5 étoiles
1
4 étoiles
0
3 étoiles
0
2 étoiles
0
1 étoile
0
  • 5
    avis de flashdantz laissé le 17/06/2022
    Formation très claire et facile à suivre. Elle m'a permis de me remettre dans le bain du CSS et du HTML après quelques années sans pratique. Merci !
    "Merci a toi d'avoir suivi cette formation et content qu'elle t'ai permis de te remettre ds le bain du code 😉"

  • Avec quelles versions de logiciels ce tuto est-il compatible ?
    HTML , CSS , jQuery
  • Que contient le fichier source ?
    La maquette Figma, les fichiers pour commencer le tuto en même temps que le formateur, et bien sûr l'intégration finale.
  • Quel est le niveau requis pour suivre ce tuto ?
    intermédiaire
Parcours Developpeur Front End
accédez à plus de 1448 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données