Cours 1 : Introduction au CSS

Bienvenue à la première conférence de « De base à Brilliance » : votre voyage vers la maîtrise du CSS commence ici !

Qu'est-ce que CSS ?

CSS, ou Cascading Style Sheets, est le langage utilisé pour décrire la présentation d'une page Web. Alors que HTML fournit la structure et le contenu, CSS est ce qui rend les pages Web attrayantes et conviviales. Il contrôle la mise en page, les couleurs, les polices, l'espacement et bien plus encore.

Pourquoi CSS est-il important ?

• Séparation des préoccupations : CSS vous permet de séparer le contenu (HTML) de la présentation (CSS), rendant votre code plus propre et plus facile à maintenir.
• Cohérence : Vous pouvez appliquer un style cohérent sur plusieurs pages Web en liant un seul fichier CSS.
• Conception réactive : CSS est essentiel pour créer des sites Web qui s'affichent bien sur tous les appareils, des ordinateurs de bureau aux smartphones.

Syntaxe CSS de base

CSS est composé de règles qui ciblent les éléments HTML. Chaque règle est constituée d'un sélecteur et d'un bloc de déclaration.

selector {
  property: value;
}

• Sélecteur : Cible l'élément HTML que vous souhaitez styliser.
• Propriété : L'aspect de l'élément que vous souhaitez modifier (par exemple, la couleur, la taille de la police).
• Valeur : La valeur spécifique que vous souhaitez appliquer à la propriété.

Exemple:

Disons que vous souhaitez changer la couleur de tous les éléments

en bleu.

HTML :

Hello, World!

CSS :

h1 {
  color: blue;
}

Cette règle simple transformera le texte de tous les éléments

en bleu.

Ajout de CSS au HTML

Il existe trois manières principales d'ajouter du CSS à votre document HTML :

1. Inline CSS : Directement dans l'élément HTML.

   
Hello, World!

1. CSS interne : Dans une balise

1. CSS externe : Lien vers un fichier CSS externe à partir de votre document HTML.

styles.css :

   h1 {
     color: blue;
   }

Exercice pratique

• Créez un fichier HTML avec quelques éléments différents comme

  ,

  et

  .
• Appliquez différentes couleurs, tailles de police et couleurs d'arrière-plan à ces éléments en utilisant les trois méthodes : CSS en ligne, interne et externe.
• Expérimentez différentes propriétés pour voir comment elles affectent l'apparence de vos éléments.

---

Prochaine étape : Dans la prochaine conférence, nous aborderons les Sélecteurs et propriétés et apprendrons comment cibler et styliser différents éléments de votre page Web. Restez à l'écoute!

---

Cette première conférence présente les bases du CSS, expliquant ce que c'est, pourquoi c'est important et comment écrire des règles CSS simples. L'exemple fourni est facile à suivre et l'exercice encourage les élèves à pratiquer et à explorer par eux-mêmes.

suivez-moi sur LinkedIn

Ridoy Hasan