Le Deal du moment :
Jeux, jouets et Lego : le deuxième à ...
Voir le deal

Partagez
 

 Des variables dans la feuille CSS

Aller en bas 
Des variables dans la feuille CSS - Lun 17 Déc - 13:09

Des variables

dans la feuille CSS

J'ai découvert ça y'a quelques jours et depuis, ça me change tellement la vie !!

Une variable c'est sert à stocker une information. Si tu fais de la programmation (genre JavaScript) tu dois bien connaitre. Sinon, tu peux imaginer qu'une variable c'est une boite dans laquelle tu ranges quelque chose. Cette boite, elle a un identifiant, son nom qui va te permettre de récupérer le contenu de la boite et de le réutiliser à l'infini.

Tu vois où je veux en venir ? LES COULEURS !
Tu vas pouvoir les définir une fois tout en haut de la feuille CSS et si il faut modifier la couleur ça sera hyper simple & rapide !!


Synthaxe


Pour déclarer les variables faut écrire :
Code:
:root{
  --fondforum: #e9e9e9; /* gris */
  --fondfonce: #a8b7d3; /* mauve */
  --fondclair: #fff;
  --bordure: #fff;
  --colorone: #982786; /* magenta -- titre et sous titre*/
  --colortwo: #aa3a98; /* violet clair */
  --colorthree: #008d9b; /* vert-eau -- lien */
  --colorfour: #512563; /* mangeta soulignement gras et italic */
}

le nom de la variable commence forcément par les 2 tirets. Ne doit pas contenir de chiffre et être en minuscule.
J'ai mis des commentaires, personnellement, ça me sert à me repérer, je préfère avoir un nom de variable générique et ensuite, précisé où la couleur est utilisée. Mais vous n'êtes pas obligé, vous pouvez mettre autant de variable que vous voulez & le nom de votre choix !

Ensuite, pour l'utiliser plus bas dans votre feuille CSS, vous appelez la variable ainsi : (en remplaçant le nom de la variable par celui que vous voulez utiliser !)
Code:
h3.titreRP{
  color: var(--colorone);
}


Et voilà !!



En espérant que ce tuto va autant te simplifier la vie que la mienne ! Si une question subsiste, n'hésite pas à répondre à ce sujet pour demander des éclaircissements.

Enjoy coding !
 Des variables dans la feuille CSS 3522390538


Arya

Jamy
Jamy
ex-staffienne
 
Des variables dans la feuille CSS
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Bienvenue {USERNAME} & autres variables utilisable.
» titre des messages dans notifications

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Avada Kedagraph :: Section Codage :: Tutos et Astuces - code :: HTML5/CSS3-
Sauter vers: