Synchro image et background [resolu]

Salut,

Je suis tombé sur ce site :

http://fitnessgurunyc.com/

Il y a un background en repeat, qui est une petite image carrée de 80px de coté environ. Et il y a un gros <div> centré de 960px au milieu de la page dans lequel tout en haut il y a le logo et le slogan: une grosse image de 100px de hauteur et vraisemblablement de 960px de largeur.

Ma question est : comment font-ils pour que le fond du logo coincide exactement avec le background de la page independamment de la resolution de l'ecran ? Si la taille de l'ecran change, alors le background de la page et le fond du logo ne seront pas forcement alignés...
Modifié par apericube (23 Oct 2009 - 19:21)

Bonjour,

Je dirais qu'ils utilisent un PNG transparent, sans se soucier du fond de la page

Euh? Mais il y a une ombre semi-transparente tres large derriere le personnage blanc. Si ton PNG inclue cette ombre il incluera aussi ce qu'on voit a travers non ?

Faut me le dire si je pose des questions trop debiles !
Modifié par apericube (30 Sep 2009 - 13:39)

Salut,

Qu'est-ce que tu ne comprends pas, concrètement, dans l'utilisation d'un fond semi-transparent ? Et du fait de cette utilisation que l'on voit au travers donc, le motif répétitif de fond ? Ca parait logique non ? Tes lunettes de soleil sont semi-transparente, tu vois au travers les éléments du décor et ceux-ci ne sont pas intégrés dans tes verres.

La solution du PNG [semi-]transparent est une solution, celle utilisée ici. Il y en a d'autres, comme par exemple centrer le fond sur l'axe des x au lieu de le positionner à gauche (par défaut). Comme ça le logo sera toujours au même endroit par rapport au motif, quelle que soit la résolution.

Salut,

Désolé de reagir un mois apres, j'avais fermé ce thread par inadvertence et je viens seulement de retomber dessus en browsant les forums..

Agylus : je comprend tout a fait cette histoire de transparence. Mais si par exemple tu crees un PNG tout blanc avec au centre un personnage projetant une ombre sur le fond, et qu'ensuite tu met ce fond en "transparent", eh bien si tu veux placer ce PNG sur un fond jaune tu verras que le l'ombre du personnage aura gardé le blanc de ton PNG !

Me trompe-je ?

apericube a écrit :
Me trompe-je ?

Oui...

PNG, contrairement aux GIF peut utiliser la transparence Alpha, donc au lieu d'une transparence 0 ou 1 (comme pour les gif) il est capable de donner des niveau de transparence en % comme tu le ferait avec un calque sous photoshop. Et non, si le PNG est sauvé en PNG24 il ne mettra pas une couleur par defaut au niveau des transparences relatives.

Peut-être devrais tu faire un essai, pour bien comprendre comme les PNG fonctionnent.

Aaaah mais je ne connaissais point le PNG24 ! Je crois que ca va devenir mon meilleur ami. Merci pour les reponses.