Vous êtes ici

Donner du style à vos pages web avec CSS

Donner du style à vos pages web avec CSS

Contexte :

Le langage CSS3 a beaucoup évolué et favorisé la conception en responsive webdesign. Vous élaborerez des feuilles de style pour gérer l’apparence et la disposition des éléments de vos pages Web selon différents contextes.

Public :

Toutes personnes ayant déjà des notions de base en CSS.

Objectifs :

  • Créer le squelette d’une page avec du CSS
  • Styliser des effets visuels (Ombre portée, reflets, dégradés, etc ...)
  • Apprendre a gérer les contexte des différents terminaux

Durée :

2 jours

Les Plus :

Cette formation est totalement opérationnelle : chaque participant créé pendant le stage son propre site web personnalisé.

Certification :

Possibilité de délivrer une formation certifiante TOSA dans le cadre du CPF ou de la Période de Professionnalisation. (Prévoir le coût de la certification en supplément)

Logo TOSA.

 

Pour toute demande concernant la formation contactez-nous au

03 80 60 52 99

Programme :

Introduction
    Le Web sémantique. L’accessibilité. L’encoding.

La base des CSS

  • Les avantages des feuilles de style.
  • Les différentes versions de CSS (CSS1, CSS2, CSS3).
  • La cascade CSS. Le stockage des feuilles CSS.
  • Le support par les navigateurs.
  • Les types de sélecteurs (id, class et balises).
  • L’ordre de priorité. Les propriétés.
  • Les unités de mesure (em, px, pt...).
  • Les couleurs (RVB versus de base).

Création et gestion de styles. Gestion des unités relatives. Adaptation aux types de médias.
Les boîtes et blocs

  • Positionnement dans le flux (relatif, flottant), positionnement hors flux (absolu, fixe).
  • Le z-index (altitude). La propriété box-sizing. Les contextes de formatage.
  • Fonds et bordures (couleurs, transparence, coins arrondis, ombres portées).
  • Cas particulier des tableaux.

Création d’un squelette de page (positionnement par div).

  • Modification des fontes (tailles, polices, couleurs...).
  • Alignement du texte.
  • Les pseudo-classes.
  • Les effets visuels (clignotement...).
  • Listes et menus horizontaux et verticaux.

Les images

  • De contenu (img) versus d’apparence (background).
  • Liens et images.

 

Retour en haut de page