Forum d'entraide PHPFrance

Hey

,

Ça fait plusieurs fois que ça m'agace de voir des sites sans couleur de fond spécifiée. En effet, pour mes développements, j'utilise une feuille de style créée par mes soins, dans laquelle je redéfinis la couleur de fond. Cette feuille se place entre celle du navigateur et celle du site Web. Donc quand des sites ne redéfinissent pas leur couleur de fond, j'ai ma couleur perso pour mon mode développement, et ça casse tout le design …

Je voulais donc en faire un petit communiqué zici, mais je me suis dit : « ho, on va dire que je suis un maniac, un débile qui est un cas très isolé », mais la lecture du billet de Roger Johansson : Remember to specify a background color me dit que je ne dois pas être un cas si isolé que ça (bon, lui à d'autres arguments, mais ça revient au même).

Article intéressant et qui montre qu'il faut toujours spécifier une couleur de fond, et même si c'est blanc

.

Merci

.

C'est noté…

Moi je met toujours une couleur de fond car le plus souvent mes background sont des dégradés.

Le problème reste le même, tu peux déclarer ceci :

Code : Tout sélectionner

background: url("Media/Image/Background.png");

Ce qui revient à :

Code : Tout sélectionner

background: transparent url("…") …;

Donc là encore, il faut déclarer une couleur :

Code : Tout sélectionner

background: #fff url("Media/Image/Background.png") 0 0 repeat-x;

par exemple

.

Moi je fais toujours:

Code : Tout sélectionner

background: #fff url("Media/Image/Background.png") 0 0 repeat-x;

À noter que le fait d'oublier d'indiquer une couleur d'arrière-plan quand on déclare une couleur de texte (ou qu'on indique la valeur transparent à background-color) n'invalide pas la feuille de style : le validateur des CSS se contentera d'émettre un avertissement, comme quoi aucune couleur d'arrière-plan n'est définie.

Autrement dit, il n'est pas toujours nécessaire d'indiquer explicitement et systématiquement une couleur d'arrière-plan, à partir du moment où la première couleur d'arrière-plan rencontrée (en partant de la « surface ») a suffisamment de contraste avec la couleur de texte déclarée. Par exemple :

Code : Tout sélectionner

<div>
  <span>Un morceau de texte blanc sur une image d'arrière-plan</span>
</div>

Code : Tout sélectionner

div {
  color: silver;
  background: black;
}
span {
  display: block;
  width: 100px;
  min-height: 120px;
  color: white;
  background: transparent url(un-degrade-de-rouge-et-de-bordeaux.png) repeat-x; 
}

Le texte de l'élément span est en blanc et s'affiche sur une image d'arrière-plan présentant un dégradé de couleurs (du rouge au bordeaux, par exemple). Aucune couleur d'arrière-plan n'est déclarée pour l'élément span (si ce n'est une couleur « transparente »). Mais, si on désactive les images, le texte sera néanmoins visible, grâce à la première couleur d'arrière-plan rencontrée (celle de l'élément parent div), qui est le noir ; et comme blanc sur noir donne un contraste parfait en matière d'accessibilité, ça passe comme une lettre à la poste.

Forum d'entraide PHPFrance

Mettre une couleur de fond à vos pages !

Mettre une couleur de fond à vos pages !