Effet d'ombrage autour d'un bloc

Bonjour,

Je me pose la question, comment on fait des ombrages autour d'un élément? Je ne parle pas du texte, bien sur. En ce qui concerne les boutons, on sait comment faire les effets de 'sliding doors of tabbed navigation'. Mais regardez la page de CSS Beauty (http://www.cssbeauty.com/):
on remarque une fine ombre autour de chaque bloc. C'est encore des images de fon?
Merci pour vos réponses.

Bonjour,

Oui, c'est une image de fond.
Avec Firefox, tu peux le voir de la manière suivante:
-click droit sur la page, puis "Voir Page Info"
-ensuite tu sélectionne l'onglet "Media", ce qui va te faire une liste de toutres les images utilisées par cette page.
-et tu trouves par exemple http://www.cssbeauty.com/img/contentshabg.gif qui par répétition verticale va te créer des "ombres" sur les bords

+

ou installe, toujours sous firefox , developpers tools... un petit bijoux indispensable pour décortiquer les sites et apprendre plein de choses.

c'est une extention FireFox.

L'effet d'ombrage d'une boîte n'est pas encore (qui sait...) géré par un paramètre CSS propre.

Il s'agit donc toujours de l'utilisation de 'background' avec les prédispositions qui vont bien (repeat, scroll, etc...).

Maintenant pour avoir une ombre "intelligente" c'est à dire qui puisse épouser le fond qui la précède l'usage d'une image PNG utilisant la transparence gérée par le format 24 bits afin d'avoir un esthétique de toute beauté.

Mais cette transparence n'est (mal) pas interpretée par la famille des navigateurs à contre courant* c'est-à-dire Internet Explorer au moins juqu'à la version 6. Via des techniques CSS épurées.

Donc un JPEG ou un GIF suivant le cas devra encore être utilisé si tu veux avoir cet effet sur les principaux navigateurs.

Ou faire comme sur ce site à savoir ne pas afficher cet effet pour les navigateurs incompatibles comme IE 6 et <.

À noter que ce site s'octroie le luxe d'avoir un affichage différent (involontaire je pense) sur Mozilla (Firefox), Opera (8) et Internet Explorer (6)...

Phil a écrit :
À noter que ce site s'octroie le luxe d'avoir un affichage différent (involontaire je pense) sur Mozilla (Firefox), Opera (8) et Internet Explorer (6)...

Bonjour,

Différencier les CSS screen pour IE5.X-6.0 d'une part, et les navigateurs conformes ainsi que le futur IE7... va être une nécessité à laquelle il est bon de se préparer dès maintenant.

Il est vrai mais avoir un affichage différent sur Mozilla et Opera dans leurs dernières versions n'est pas quelque chose à encourager comme sur le site cité.

Les utilisateurs d'Opera sont si peu nombreux pour ne pas dire dans des proportions négligeables sur certains sites grand publics à majorité IE 5.x-6...