Couleurs W3.CSS


Le schéma de couleurs par défaut utilisé dans W3.CSS est inspiré des couleurs de conception matérielle (couleurs utilisées dans le marketing, les panneaux de signalisation et les notes autocollantes).


Coloration des éléments HTML

Les classes w3 - color et w3-text- color peuvent être utilisées pour colorer n'importe quel élément HTML :

Conteneurs :

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.

Boutons:

Texte:

Rouge Violet Bleu Vert Orange

Les frontières:

rouge

Vert

Bleu

Jaune

Gris

Noir

Les tables:

Nom Points
Jill Smith 50
Ève Jackson 94
Adam Johnson 67

Cartes:

Une voiture est un véhicule à moteur autonome à roues utilisé pour le transport. La plupart des définitions du terme précisent que les voitures sont conçues pour rouler principalement sur les routes, pour avoir des sièges pour une à huit personnes, pour avoir généralement quatre roues. (Wikipédia)



Couleurs de fond

Les classes w3- color définissent la couleur d'arrière-plan de tout élément HTML :

Londres

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.


Londres

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.


Londres

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.

Exemple

<div class="w3-red">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom,
  with a metropolitan area of over 9 million inhabitants.</p>
</div>

<div class="w3-yellow">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom,
  with a metropolitan area of over 9 million inhabitants.</p>
</div>

<div class="w3-gray">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom,
  with a metropolitan area of over 9 million inhabitants.</p>
</div>

Les couleurs gris et gris sont interchangeables dans toutes les classes W3.CSS.


Couleurs du texte

Les classes w3- text- color définissent la couleur du texte de n'importe quel élément HTML :

Londres

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.

Londres

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.

Exemple

<div class="w3-text-red">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom,
  with a metropolitan area of over 9 million inhabitants.</p>
</div>


Couleurs de survol

Les classes w3-hover- color définissent la couleur de survol d'arrière-plan pour tout élément HTML :

Londres

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.

Exemple

<div class="w3-container w3-orange w3-hover-red">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom, with a metropolitan area of over 9 million inhabitants.</p>
</div>

Les classes w3-hover- text- color définissent la couleur de survol du texte pour tout élément HTML :

Londres

Londres est la ville la plus peuplée du Royaume-Uni, avec une aire métropolitaine de plus de 9 millions d'habitants.

Exemple

<div class="w3-container w3-orange w3-hover-text-white">
  <h2>London</h2>
  <p>London is the most populous city in the United Kingdom, with a metropolitan area of over 9 million inhabitants.</p>
</div>

Bibliothèques de couleurs

En plus des couleurs W3.CSS standard, W3.CSS peut également utiliser des couleurs provenant de nombreuses bibliothèques de couleurs différentes :

Couleurs Windows :

Chaux
Vert
olive
émeraude
Sarcelle
Acier
cyan
Bleu
Indigo
Cobalt
Violet
Mauve
Rose
Magenta
rouge
Orange
ambre
Jaune
brun
Taupe
terre de sienne
cramoisi

Cliquez ici pourEn savoir plus sur les couleurs Windows


Couleurs tendance :

Flamme
Verdure
Marina

Jaune primevère
Gris neutre

Épinette ombragée

Pivoine Marine

Porto Tawny

Cliquez ici pourEn savoir plus sur les couleurs tendance


Couleurs de l'autoroute :

rouge
Vert
Bleu
Jaune

Cliquez ici pourEn savoir plus sur les bibliothèques de couleurs

Vous en apprendrez beaucoup plus sur les couleurs dans les chapitres suivants de ce didacticiel.