Scribd
Importer
107 vues8 pages

Introduction au CSS3 et Sélecteurs

Le document présente les notions de base du CSS en introduisant les sélecteurs, propriétés, commentaires et indentation. Il explique comment écrire le code CSS dans une feuille externe et lier celle-ci à la page HTML. Il détaille ensuite les sélecteurs simples et complexes ainsi que les différences entre les sélecteurs id et class.

Transféré par

mohamed Aouane
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 PDF, TXT ou lisez en ligne sur Scribd
107 vues8 pages

Introduction au CSS3 et Sélecteurs

Le document présente les notions de base du CSS en introduisant les sélecteurs, propriétés, commentaires et indentation. Il explique comment écrire le code CSS dans une feuille externe et lier celle-ci à la page HTML. Il détaille ensuite les sélecteurs simples et complexes ainsi que les différences entre les sélecteurs id et class.

Transféré par

mohamed Aouane
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 PDF, TXT ou lisez en ligne sur Scribd

Partie III

CSS3
Les notions de base

Création de sites WEB statiques Réalisé par Mme N .MGHARBI 1


Plan
 Introduction
 Où écrire le code CSS?
 Indentation et commentaires
 Sélecteurs simples
 Sélecteur complexes

Création de sites WEB statiques Réalisé par Mme N .MGHARBI 2


Introduction
 Le CSS permet de mettre en page un
contenu en lui appliquant des styles
 Un sélecteur permet de cibler un ou
plusieurs éléments HTML.
 Il existe des sélecteurs simples et complexes.
 Une propriété permet de choisir l’aspect d’un
élément HTML qu’on souhaite modifier.

Création de sites WEB statiques Réalisé par Mme N .MGHARBI 3


Où écrire le code CSS?
 Il existe 3 manières pour écrire le code:
 En se servant de l’élément<Style> au sein de
l’ élément <Head>
 En ajoutant l’attribut style directement dans la
balise de l’élément qu’on souhaite modifier
 En l’écrivant sur un fichier séparé d’extension
.css, c’est la méthode la plus recommandée.
 Pour lier la feuille de style au fichier html, il faut ajouter
à ce dernier un nouvel élément <link> dans <Head>
avec les attributs REL et HREF.
Création de sites WEB statiques Réalisé par Mme N .MGHARBI 4
Indentation et commentaires
 Pour la clarté et la propreté du code,
l’indentation et les commentaires sont
également conseillés pour le langage CSS
 Les commentaires en CSS n’impactent pas le
style.
 On écrit les commentaires entre les deux
symboles suivants: /* et */.
 Exemple: /* commentaire */

Création de sites WEB statiques Réalisé par Mme N .MGHARBI 5


Sélecteurs simples
 Pour appliquer le style, on peut:
 Préciser des aspects (styles) pour chaque
sélecteur
 Ou appliquer les mêmes modifications à plusieurs
sélecteurs en les séparant par des virgules
p, h1{
color: red;
}

Création de sites WEB statiques Réalisé par Mme N .MGHARBI 6


Sélecteurs complexes
 les sélecteurs #id et .class permmettent de
cibler un élément en particulier plutôt qu’un
type d’élément.
 Méthode:
 Partie HTML: Ajouter les attributs id et
/ou class à l’intérieur de la balise de l’élément
cible en lui affectant une valeur
 Partie CSS: cibler cet élément en l’appelant par
son id ou sa classe.

Création de sites WEB statiques Réalisé par Mme N .MGHARBI 7


Sélecteurs complexes
 Différences entre id et class:
 On ne peut trouver deux éléments avec la même
valeur de l’attribut id.
 En revanche, on a le droit d’affecter la même
valeur de l’attribut class à plusieurs éléments du
même document HTML

Création de sites WEB statiques Réalisé par Mme N .MGHARBI 8

Vous aimerez peut-être aussi