Scribd
Importer
452 vues12 pages

Cours Complet HTML & CSS Gratuit

Le document présente un cours complet sur HTML et CSS, expliquant la structuration des pages web avec HTML et la stylisation avec CSS. Il couvre des concepts essentiels tels que les balises HTML, la création de formulaires, le positionnement en CSS, et le responsive design. Enfin, il résume les étapes pour construire un site moderne en intégrant ces technologies.

Transféré par

SALAR Cameroun
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PPTX, PDF, TXT ou lisez en ligne sur Scribd
452 vues12 pages

Cours Complet HTML & CSS Gratuit

Le document présente un cours complet sur HTML et CSS, expliquant la structuration des pages web avec HTML et la stylisation avec CSS. Il couvre des concepts essentiels tels que les balises HTML, la création de formulaires, le positionnement en CSS, et le responsive design. Enfin, il résume les étapes pour construire un site moderne en intégrant ces technologies.

Transféré par

SALAR Cameroun
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PPTX, PDF, TXT ou lisez en ligne sur Scribd

Cours Complet HTML & CSS

Structuration, Stylisation, Responsive


Design et Positionnement
Qu’est-ce que le HTML ?
• HTML : HyperText Markup Language
• Permet de structurer une page web
• Utilise des balises pour organiser le contenu
(titres, images, liens, etc.)
Structure de base HTML
• <!DOCTYPE html>
• <html> <head> <title>...</title> </head>
<body> ... </body> </html>
Balises HTML essentielles
• <h1> à <h6> : Titres
• <p> : Paragraphe
• <a href='...'> : Lien hypertexte
• <img src='...'> : Image
• <ul>, <ol>, <li> : Listes
• <br>, <hr> : Saut de ligne, séparation
Balises de structuration HTML5
• <header>, <nav>, <main>, <section>,
<article>, <aside>, <footer>
• Permettent une structure logique et
sémantique
Créer un formulaire HTML
• <form>, <input>, <textarea>, <button>,
<select>
• Utilisé pour collecter des données utilisateur
Qu’est-ce que le CSS ?
• CSS : Cascading Style Sheets
• Permet de styliser une page HTML : couleurs,
polices, disposition
• Utilisation par balise, classe ou ID
Syntaxe CSS de base
• p { color: blue; font-size: 16px; }
• .maClasse { ... }
• #monId { ... }
Flexbox pour mise en page
• display: flex; justify-content; align-items
• Permet d'aligner et distribuer les éléments
facilement
Positionnement en CSS
• position: static, relative, absolute, fixed, sticky
• top, left, right, bottom pour déplacer un
élément
• z-index pour gérer la superposition
Responsive Design (adaptatif)
• Utiliser : <meta name='viewport'>
• @media queries : adapter le CSS à la taille de
l'écran
• Unités flexibles : %, vw, vh, rem
• Flexbox et Grid pour adapter le layout
Résumé : construire un site
moderne
• 1. Structurer avec HTML5 sémantique
• 2. Styliser avec CSS (couleurs, polices, layout)
• 3. Adapter avec Media Queries (responsive)
• 4. Placer les éléments avec Flexbox ou Position

Vous aimerez peut-être aussi