Tutoriel HTML5: Apprenez à créer votre site web avec HTML 5 et CSS3 !
Cours HTML 5 / CSS 3
Comment utiliser les dernières nouveautés HTML5 et CSS3 pour Créer des Applications Magnifiques que vos visiteurs adorent !
INTRODUCTION 1ÈRE PARTIE. HTML5
PARTIE 1. CRÉER UNE PAGE HTML5
– Le doctype
– La balise HTML
– L’en-tête du document
– L’encodage (le charset) du document
Le document HTML
PARTIE 2. METTRE EN FORME VOTRE TEXTE AVEC HTML5
– Le saut de ligne
– Texte en gras Texte en italique
– Texte en exposant et en indice
– Texte barré
– Les commentaires avec HTML 5
PARTIE 3. DÉFINIR LES TITRES, CITATIONS, LISTES ET LES PARAGRAPHES
– Les titres
– Les paragraphes
– Les citations
– Les séparateurs horizontaux
– Les listes numérotées
– Les listes imbriquées
PARTIE 4. CRÉER DES LIENS HTML5
– L’ajout d’un lien
– Lien vers une page
– Les liens dans une page
– Les liens vers un autre site
– Les liens vers une adresse mail
– Les liens vers un fichier
CHAPITRE 5. UTILISER LES IMAGES AVEC HTML5
– Les images
– L’ajout d’une image
– L’ajout d’un lien sur une image
– La bordure de l’image
– L’ajout d’une couleur en arrière-plan
PARTIE 6. LES NOUVELLES BALISES HTML5 HEADER SECTION NAV FOOTER
– Les nouvelles balises HTML5
PARTIE 7. UTILISER LES FORMULAIRES HTML5
– Organisez vos formulaires complexes
– Suggestion via un champ texte
– Vérifier une adresse mail
PARTIE 8. 3 TECHNIQUES POUR LES NOUVEAUX FORMULAIRES HTML5
– Un champ au format numérique
– Un champ au format date
– Un champ au format horaire
– Un champ de recherche
– La palette de couleurs
– Les curseurs
– Exemple d’ application
PARTIE 8.1 TABLEAUX HTML : LES NOTIONS DE BASE
PARTIE 9. AJOUTER UN LECTEUR AUDIO HTML5 COMPATIBLE TOUT NAVIGATEUR
– L’ajout d’un fichier audio
– Les formats pris en charge
– La balise <source>
PARTIE 10. AJOUTER UN LECTEUR VIDÉO HTML5 COMPATIBLE TOUT NAVIGATEUR
– L’ajout d’un fichier vidéo
– Les formats pris en charge
– La balise <source>
PARTIE 11. UTILISER LA GÉOLOCALISATION AVEC HTML5 ET JAVASCRIPT
– La géolocalisation
PARTIE 12. UTILISER LE STOCKAGE LOCAL ET PERSISTANT DANS LE NAVIGATEUR
– Stocker des données dans le navigateur
– Le stockage temporaire
– Le stockage persistant
PARTIE 13. LES API JAVASCRIPT HTML5
– Les API JavaScript avec HTML5
PARTIE 14. Cinq BONNES PRATIQUES HTML5 SUR MOBILES
– Les sites pour mobiles avec HTML5
PARTIE 15. LE DOCTYPE HTML5 À UTILISER POUR LES MOBILES
– Écrire le doctype pour un site mobile
– La taille de la fenêtre d’affichage
– Écrire le doctype pour un site mobile
PARTIE 16. CRÉER DU TEXTE MULTI-LIGNES ET UN BACKGROUND AVEC CANVAS
2ÈME PARTIE. CSS3
PARTIE 17. MAÎTRISER LES BASES DE CSS3
– Utilité des feuilles de style
– CSS intégré à une balise HTML 5
PARTIE 18. METTRE EN FORME VOTRE TEXTE AVEC CSS3
– Texte en gras
– Texte en italique
– La taille du texte
– La couleur du texte
– Aligner du texte
– Texte souligné
PARTIE 19. UTILISER LES POLICES DE CARACTÈRES AVEC CSS3
– L’utilisation d’une police de caractères
– Le style d’une police de caractères
– Les polices système
PARTIE 20. PERSONNALISER VOTRE TEXTE AVEC CSS3 – PARTIE 1
– Les transformations du texte
– Indentation du texte
– Définir l’espace entre les lettres
PARTIE 21. PERSONNALISER VOTRE TEXTE AVEC CSS3 – PARTIE 2
– L’interligne du texte
– Ajouter des espaces vides
– Alignement d’un texte
– Définir la direction du texte
– Définir la hauteur et la largeur
PARTIE 22. PERSONNALISER LES LISTES NUMÉROTÉES ET IMBRIQUÉES
– Définir le type de puce de la liste
– Choisir une image pour la puce
– L’option retrait
PARTIE 23. UTILISER LES ARRIÈRE-PLANS AVEC CSS3
– Définir la couleur du fond
– Ajouter une image de fond
– Répéter l’image de fond
– Positionner l’image
– Fixer l’image de fond/ pas de défilement
PARTIE 24. UTILISER LES DIV AVEC CSS3
– Notion de bloc Type de bloc
– Largeur et hauteur d’un bloc
– Les marges externes
– Les marges intérieures
PARTIE 25. LES DIV CSS3 N’AURONT PLUS DE SECRET POUR VOUS !
– La couleur de la bordure
– L’épaisseur de la bordure
– Le style de la bordure
PARTIE 26. LA PERSONNALISATION DES LIENS AVEC CSS3
– La couleur des liens
– Les infobulles sur les liens
– Les liens sur les blocs
– Les différentes couleurs des liens
– Compléments
PARTIE 27. LES BALISES CSS3 SUPPLÉMENTAIRES
– Balises CSS pour les paragraphes
– Insérer du contenu
PARTIE 28. CRÉER DES TRANSITIONS POUR VOS MENUS
– Effectuer une transition sur un menu
PARTIE 29. DÉFINIR LA POSITION DE VOS BLOCS DIV
– Le positionnement statique
– Le positionnement relatif
– Le positionnement absolu
– Le positionnement fixe
– La propriété float
– La propriété clear
PARTIE 30. LES TECHNIQUES AVANCÉES POUR DÉFINIR LA POSITION DE VOS BLOCS DIV
– La superposition de blocs
– Le dépassement de la taille d’un bloc
– La visibilité du contenu d’un bloc
– Contrôler l’affichage d’un bloc
– Contrôler la visibilité du contenu d’un bloc
– Modifier le curseur de la souris
CHAPITRE 31. LES NOUVELLES BALISES CSS3 – PARTIE 1
– Les bords arrondis
– Les bordures à partir d’une image
– Ajouter une ombre sur du texte
– Créer un effet miroir
– Effectuer un fondu d’images
PARTIE 32. AJOUTER DES POLICES PERSONNALISÉES AVEC GOOGLE FONTS
– Les polices personnalisées
– Afficher des lettres creuses
CHAPITRE 33. UTILISER LES NOUVELLES BALISES CSS3 – PARTIE 2
– Un résumé sur les titres longs
– Saut à la ligne automatique pour un texte
– Redimensionner un bloc
– Effectuer un dégradé de couleur linéaire
– Effectuer un dégradé de couleur circulaire
– Ajouter de la transparence
PARTIE 34. UTILISER LES NOUVELLES POSSIBILITÉS CSS3 – PARTIE 3
– Rappel sur les préfixes CSS 3
– Présenter un contenu en colonnes
– Transformations CSS3
– Le texte défilant
– Les filtres graphiques
– Les masques
PARTIE 35. Deux STRATÉGIES POUR SIMPLIFIER VOTRE DÉVELOPPEMENT CSS3
PARTIE 36. ORGANISER VOTRE CODE CSS POUR PLUS D’EFFICACITÉ
– Apprenez à structurer votre code CSS en le divisant
– Exemple d’ application
PARTIE 37. STRATÉGIE CSS AVANCÉE POUR GAGNER UN TEMPS CONSIDÉRABLE
PARTIE 38. Cinq PRATIQUES CSS3 POUR DES APPLICATIONS PERFORMANTES SUR MOBILES
– Les bonnes pratiques CSS3
Vous en voulez plus ?
HTML 5 CSS 3 & responsive design : formation professionnelle ⬇️