Ceci est un paragraphe.
Dans cet exemple, nous avons un document HTML de base. La déclaration indique que nous utilisons HTML5. La section
contient des informations meta comme le titre de la page. La section
contient le contenu visible de la page, avec un titre de niveau 1 (
) et un paragraphe (
).
Ajouter des Liens et des Images
Les liens et les images sont des éléments incontournables d’une page web. Voici comment les ajouter :
Visitez Exemple.com
Le lien est créé avec la balise et l’attribut
href
. L’image est insérée avec la balise et les attributs
src
et alt
, ce dernier étant important pour l’accessibilité.
Structure Avancée avec les Listes et les Tableaux
Pour organiser davantage votre contenu, vous pouvez utiliser des listes et des tableaux :
- Élément de liste 1
- Élément de liste 2
En-tête 1 | En-tête 2 |
---|---|
Donnée 1 | Donnée 2 |
Les listes non ordonnées sont créées avec la balise
- pour l’ensemble de la liste et
- En ligne : Utilisez l’attribut
style
directement dans les balises HTMPar exemple :Ceci est un texte bleu.
- Interne : Ajoutez un bloc
- Externe : Utilisez un fichier CSS externe et liez-le à votre document HTML avec la balise
:
- Externe : Utilisez un fichier CSS externe et liez-le à votre document HTML avec la balise
- Type : Sélectionne tous les éléments d’un type spécifique (p. ex.,
p
pour les paragraphes). - Classe : Sélectionne les éléments ayant une classe spécifique (p. ex.,
.class-name
). - ID : Sélectionne un élément avec un identifiant spécifique (p. ex.,
#id-name
). - color : Modifie la couleur du texte.
- font-size : Change la taille du texte.
- margin : Ajoute des marges externes aux éléments.
- padding : Ajoute des marges internes aux éléments.
- background-color : Change la couleur de fond.
pour chaque élément de la liste. Les tableaux utilisent les balises
,
(ligne),
(cellule d’en-tête) et
(cellule de données).
Qu’est-ce que le CSS ?
CSS, ou Cascading Style Sheets, est le langage qui permet de décrire la présentation d’un document HTMIl est utilisé pour contrôler l’apparence des pages web, y compris les couleurs, les polices, les espacements, la disposition et bien plus encore. Le CSS fonctionne en applicuant des styles aux éléments HTML à l’aide de sélecteurs.
Intégration de CSS dans HTML
Il existe plusieurs façons d’intégrer CSS dans vos fichiers HTML :
Sélecteurs CSS
Les sélecteurs permettent de cibler les éléments HTML à styler :
Voici un exemple simple de CSS utilisant ces sélecteurs :
Propriétés CSS de base
Les propriétés CSS définissent les styles appliqués aux éléments HTMVoici quelques propriétés couramment utilisées :
Exemple pratique :
3. Techniques Avancées en HTML
Utilisation des Formulaires
Les formulaires HTML permettent de collecter des informations auprès des utilisateurs. Voici un exemple de formulaire simple :
Dans cet exemple, nous utilisons la balise