Accueil    CSS    Débuter avec le css
 



Débuter en css  Débuter en css

Index des styles


Introduction :



Le principe du CSS est dans un premier temps de pouvoir modifier et personnaliser l'apparence des contrôles html mais également de permettre une séparation claire de la structure du document avec le style.

Il faut donc tout d'abord bien comprendre quels sont les moyens permettant de déclarer les styles (l'article sur la déclaration des styles css explique ces différentes méthodes) :
    - Utilisation de l'attribut style des éléments html
    - Utilisation de la balise <style> au sein d'un document html
    - Appel à une feuille de style css centralisant les styles
    - Utilisation du javascript pour changer dynamiquement les styles

L'apprentissage des styles applicables à proprement parlé se fait avec de nombreux essais sur les différents éléments html via différents cas de figure. Pour débuter l'idéal est d'employer l'attribut style des balises html et de faire des essais de mises en forme de textes, de création de bordures puis d'aller vers des mises en formes plus complexes relatives au positionnement et à la notion d'affichage en ligne ou en bloc.



Exemples




    - Style des textes
Dans un document vide, nous allons afficher différents textes avec des mises en forme sur la police la couleur et d'autres propriétés classiques.


    - Style d'un conteneur
Dans un conteneur (ici un élément inline <span> et un élément block <div>) nous allons appliquer des styles relatif aux bordures et aux espaces entre conteneur et contenu.


    - Mise en forme d'un formulaire
La réalisation de formulaires de saisie est un exercice classique dans la réalisation de certaines pages et il convient de bien maitriser la mise en page, l'alignement et les styles des zones de saisie.


    - Mise en forme d'un tableau
Nous allons ici employer les styles qui permettent de gérer de façon précise le rendu d'un tableau html (gestion des bordures de l'alignement vertical ...).


    - Arrières-plans
Nous allons mettre en place le rendu d'arrières-plans sur différents éléments d'une page en jouant également sur l'opacité.