CSS

Présentation

Ce que vous devez savoir

Avant d'apprendre le langage CSS, vous devez connaitre le langage HTML puisque le rôle du CSS est de présenter les éléments HTML

Comment ça fonctionne

La caractéristique principale d'une source CSS est exprimée par le couple propriété : valeur . Il est possible de regrouper plusieurs propriétés à appliquer à un élément, pour former un bloc de règles, en les délimitant par les accolades : {} . L'élément désigné auquel les propriétes css vont s'appliquer se nomme sélecteur . La syntaxe générale d'une feuille de style est donc la suivante :

selecteur {
propriété : valeur;
}

Exemple visuel :

p{
  color: red;
}

See the Pen presentation css by salsacobo (@salsacobo) on CodePen.

Affichage sur la page :

Dans cet exemple la propriété couleur ( color ) permet de mettre en rouge ( red ) le paragraphe désigné par le sélecteur p { }

See the Pen presentation css by salsacobo (@salsacobo) on CodePen.

Enjeux

Le CSS permet de séparer les taches de structuration (assurées exclusivement par le HTML) des taches de présentations. C'est le CSS qui assure seul la mise en forme d'un document web. Les avantages du CSS sont multiples :

  • * Il est possible de travailler le contenu indépendamment de sa présentation
  • * Permet d'uniformiser la mise en page du site
  • * Permet de répercuter facilement une modification sur toutes les pages du site
  • * Permet de réduire la complexité et la taille d'une page HTML
  • * Permet d'adapter la présentation d'une même page en fonction du terminal (tablette, smartphone..)

Les versions du langage CSS

Le langage CSS à évolué avec le temps, de la version CSS1 (en 1996) elle est passée à la version CSS4 (encore en mode brouillon) en passant par la version CSS 2.1 qui corrige la version CSS2 puis par la version CSS3 associée au HTML5

La version CSS3 propose plus d'effets visuels et permet de créer des animations graphiques sans recourir au langage Javascript

Les incompatibilités

Le css est souvent mal ou pas du tout implémenté par certains navigateurs, comme c'est souvent le cas avec les anciennes versions d'Internet Eplorer et qui sont encore aujourd'hui utilisées. Heureusement cette inconvénient tend à disparaître avec les navigateurs récents

Pour vous aidez à assurer la compatibilité de votre travail sur un maximum de navigateur nous vous fournissons pour chaque outil web des informations sur sa prise en charge ou pas en fonction des navigateurs.

© Untitled. Design by HTML5UP.