Utilisation de "Transparent"

Salut,
Je me demandais juste à quoi sert "transparent" dans un code css.
Exemple:

background: transparent url("fond.jpg");

Merci d'avance!

Bonjour et bienvenue sur ce forum

transparent est la valeur initiale de la propriété background-color

http://www.yoyodesign.org/doc/w3c/css2/colors.html#propdef-background-color

<edit />

Dans ton exemple, si tu omets la valeur transparent, elle sera transparent de toute façon.

Note : à première vue, ça peut paraître ridicule d'avoir pour un même élément une image de fond ET une couleur de fond. Ça prend tout son sens si l'image n'occupe pas toute la surface de l'élément, si elle a des zones transparentes (gif, png), ou encore si elle n'est pas chargée (préférences utilisateur).
Modifié par Stephan (15 Jul 2006 - 17:48)

Bonsoir,

La propriété background-color n'étant pas héritée , il est donc rare qu'on ait à spécifier un background:transparent puisque c'est la valeur par défaut, comme le rappelle Stephan.

Cela arrive cependant, de temps à autre, quand on a à surclasser un sélecteur de classe pour un élément isolé, par exemple.

A noter: une implémentation erronée de CSS dans Firefox et IE5.x fait qu'ils appliquent cette valeur transparent à toutes les boîtes quand l'utilisateur choisit le paramètrage "Désactiver les couleurs", au lieu de donner une priorité plus élevée au background-color des préférences utilisateurs. Le problème a été corrigé pour IE à partir d'IE6.0, mais pas encore dans FF. C'est assez ennuyeux pour l'accessibilité.
Modifié par Laurent Denis (15 Jul 2006 - 17:55)

A noter que ça peut être très pourri si c'est pas contrôlé :

http://loseinside.net/log/?css-background

hihi... Remarque finement vue de notre chère Monique, en commentaire du billet que tu cites, Olivier. ça rachète le billet qui dit une grosse sottise.

En effet, Monique pointe très justement sur un point à rappeler:
- indiquer background: transparent url(..) n'a le plus souvent pas d'intérêt, puisque c'est égal à background: url(...) : la couleur non précisée est de toute façon transparente (transparent n'a en fait rien de pourri dans le cas évoqué par ce billet).
- mais penser à préciser une couleur (une vraie) avec ses images d'arrière-plan est très utile, même si elle ne se voit pas : si l'image est, pour une raison ou une autre, indisponible ou désactivée, la couleur évitera d'éventuelles superpositions textes/fond illisibles
Modifié par Laurent Denis (15 Jul 2006 - 19:04)

Merci de vos réponses... En fait j'ai vu ça dans le CSS du menu de Alsacreations.
A+

Bonjour,

Il n'est pas interdit d'utiliser cette valeur pour la propriété background-color ... il faut juste l'utiliser à bon escient et s'assurer qu'il n'y aura pas de problèmes de contraste fond/texte.
Dans le cas d'Alsacréations cette valeur est complétée par une image de fond et une couleur de fond est définie pour l'élément parent (indispensable dans les cas où les images ne sont pas affichées).

Laurent Denis a écrit :
hihi... Remarque finement vue de notre chère Monique, en commentaire du billet que tu cites, Olivier. ça rachète le billet qui dit une grosse sottise.

C'est quoi la sottise ?

Bonjour,

transparent est la valeur par défaut de la propriété background-color (et de cette partie de la propriété raccourcie background. L'ommettre ou non ne change strictement rien : le blog cité dit une grosse sottise en s'en prenant à la présence du mot "transparent". Ce qui est en cause, en fait, c'est:
- côté auteur de la CSS, de ne pas avoir testé sa CSS dans les conditions de personnalisation utilisateurs courantes et de ne pas avoir spécifié une couleur explicite
- côté utilisateur (visiteur du site CSSzengarden), de ne pas avoir une CSS user suffisamment explicite également pour éviter ce type de mésaventure

Cela dit, le CSSZengarden est une superbe vitrine du design CSS, mais n'a aucune exigence en matière d'accessibilité.
Modifié par Laurent Denis (21 Jul 2006 - 11:48)

Laurent Denis a écrit :
Bonjour,

transparent est la valeur par défaut de la propriété background-color (et de cette partie de la propriété raccourcie background. L'ommettre ou non ne change strictement rien : l'auteur dit une grosse sottise en s'en prenant à la présence du mot "transparent". Ce qui est en cause, en fait, c'est:
- côté auteur, de ne pas avoir testé sa CSS dans les conditions de personnalisation utilisateurs courantes et de ne pas avoir spécifié une couleur explicite
- côté utilisateur, de ne pas avoir une CSS user suffisamment explicite également pour éviter ce type de mésaventure

Cela dit, le CSSZengarden est une superbe vitrine du design CSS, mais n'a aucune exigence en matière d'accessibilité.

L'auteur n'a pas été bien compris alors . Il s'en prend plutôt à l'auteur lui-même qui ne pense pas forcément au fait que le fond personalisé.

Dans le message ci-dessus (le mien), les termes étaient à prendre au sens CSS:
- "utilisateur" = "user" = visiteur du CSS zen Garden
- "auteur" = celui qui a fait cette CSS zen garden

<edit>Ah, effectivement, j'ai créé la confusion en parlant aussi de l'auteur du blog. Je rectifie. Merci
Modifié par Laurent Denis (21 Jul 2006 - 11:47)