CSS 3

Objectifs

Maîtriser le langage CSS3 pour présenter les contenus web de façon optimisée et adaptative.
Compétences visées
- Décrire et utiliser les outils de développement pour tester et déboguer le CSS
- Appliquer les règles de base de CSS pour styliser les éléments et lier les feuilles de style aux documents HTML
- Sélectionner et cibler des éléments avec des sélecteurs CSS3 en fonction de leur hiérarchie, attributs et états
- Formater les contenus Web en ajustant les attributs de texte, arrière-plan, alignement, et espacement
- Créer des mises en page en utilisant le modèle de boîtes Flexbox et la grille CSS3
- Définir et appliquer des animations CSS3
- Configurer des mises en page adaptatives en utilisant des sélecteurs CSS3 et tester les rendus sur divers appareils

Programme de la formation

- Rappels : les documents Web et les langages associés
Historique des langages et technologies du web
Quel langage pour quel effet ?
Editeurs dédiés et outils en ligne de tests
Outils de débogage des navigateurs web
Documentations en ligne
- Concepts de base de CSS
Présentation de CSS
Anatomie des règles CSS
Valeurs, types et unités en CSS
Attributs raccourcis
Liaison entre document HTML et feuilles de styles CSS
- Sélecteurs CSS3
Les sélecteurs simples
Concepts du DOM
Les sélecteurs hiérarchiques
Les sélecteurs liés aux attributs
Les sélecteurs de position
Les sélecteurs d'état
Héritage et ordre d'application des règles CSS
- Mise en forme de contenus
Attributs de texte et police
Attributs d'arrière-plan
Puces, numéros
Attributs d'alignement et d'espacement
- Mise en page de documents
Le modèle de boîtes de CSS
Marges, bordures, dimensions
La mise en page historique (positionnements naturels et habillages)
Le flexbox
La grille de CSS3
Le positionnement absolu et l'empilement des éléments
- Animations
Principes d'animation en CSS3
Définition de scénarii d'animation
Application d'un scénario d'animation à des éléments
Avantages et inconvénients des animations purement CSS
- Mise en page adaptative CSS
Principes de mise en page adaptative
Les sélecteurs CSS3 utiles au design adaptatif
Tester un document sur d'autres affichages que le navigateur web.

Validation et sanction

Attestation de formation

Type de formation

Non certifiante

Sortie

Sans niveau spécifique