Informatique

Comprendre le positionnement des éléments dans une page.
Modifier dynamiquement l'apparence d'une page par rapport au périphérique de consultation.
Utiliser les transformations et animations.

HTML - Rappels sur la structuration d'une page

• Balises span et div
• Les sections logiques d'une page
• Les balises block et inline
• Propriété CSS display
• Définir la largeur, la hauteur et l'alignement
• Définir les bordures
• Définir les marges externes et internes

CSS - Les sélecteurs et les pseudos-classes évoluées

• Rappels sur les sélecteurs courants
• Rappels sur les pseudos-classes courantes
• Les pseudos-classes évoluées
• CSS pour réaliser un compteur
• CSS pour créer du contenu

CSS - Les média-queries

• Les propriétés d'affichage
• Propriété CSS visibylity
• La fonction calc() et la propriété min – max

Mise en pratique - Ecriture d'une page qui s'adapte automatiquement

Positionnement des éléments

• Les positions absolues, relatives et fixes
• Les éléments flottants
• Utilisation de top, bottom, left, right

Gérer les scrollers dans ma structure

• Propriété CSS overflow
• Mettre en place un effet parallaxe dans une page

Mise en pratique - Utilisation d'un effet parallaxe

CSS - Transformation

• Gérer la position x et y
• Modifier la taille proportionnellement
• Rotation
• Déformation

Mise en pratique - Mise en page polaroid

CSS - Transition

• Les propriétés visées par la transition
• La durée et le délai de déclenchement

CSS - Animation

• Définir une animation
• Appliquer une animation

Mise en pratique - Faire un slider

Mise en pratique - apparition d'étiquette au survol d'un élément