Si j'ai bien compris, Christian souhaite mettre sa tête (ou une photo autre) à côté de son titre de blog (en l'occurence "de la distribution au recrutement").

Ce que je peux lui proposer, c'est de créer une image et de l'intégrer à la class #top de la feuille CSS. comme je l'ai fait pour cette image sur dans mon blog.

I/ Créer et charger l'image

C'est une évidence, mais la première étape est bien la création de l'image.
Je dirai qu'une image d'une largeur (width) 1000px sur hauteur (height) 150px, ce n'est pas mal comme proportion, mais il vous faudra peut etre modifier cela pour l'adapter à votre zone "top" (cf. fin du billet).
Si vous ne souhaitez pas une image complète de fond (comme Fredlynx ou moi-même) mais juste une photo, le plus simple reste cependant de créer une image complète avec votre photos à l'endroit souhaité (gauche, droite ou centrée) le fond de l'image étant de la même couleur que le fond de votre blog (noir dans le cas de Christian). Cela donnera l'illusion que vous avez seulement ajouté une photo.
Une fois l'image créée, ajoutez-la à votre collection d'images (Dossier Images) grâce au "Gestionnaire de média" dans l'interface admin de votre blog. Pour le nom de fichier, je vous conseille un nom du genre "top_bg" ("top" parce que c'est ainsi que s'appelle la class qui gère l'affichage du titre de votre blog (et que l'élement en question est en haut !) "BG" pour background puisqu'il s'agit du fond de la zone définie par #top), ou un autre nom qui vous rappelle à quoi correspond cette image.

II/ Modification du code CSS

Vous allez, dans votre feuille CSS rechercher la class #top (petit coup de Pomme+F ou de CTRL+F pour faciliter cette recherche !).
Elle se trouve dans la zone traitant du "HEADER" ("En-tête) et ressemble probablement à ça :

(issu de la CSS de Christian
ou à ça :

(issu de ma CSS)

Dans ce code, ajoutez à la fin (mais avant l'accolade fermante } ) la ligne suivante : background: url(Images/top_bg.jpg);

Attention - Deux mises en garde :

  • ne copiez pas bêtement cette ligne. il faut que votre image s'appelle effectivement top_bg.jpg. Vérifier donc le nom que vous lui avez donné, ainsi que l'extension du fichier (.jpg .png ou autre !)
  • Conseil récurrent en CSS : N'OUBLIEZ PAS LE POINT-VIRGULE !!!

Après, le boulot est pour vous, pour ce qui est d'ajuster la taille de votre image.
Sachez juste que les paramètres "width" et "height" contenus dans #top ne concernent que la taille de la zone d'affichage (pas la gestion de l'adaptation de votre image à cette zone. Si votre image est trop grande pour cette zone, elle sera tout simplement tronquée (ce qui est le cas de mon image si vous regardez de prêt puisque la hauteur de mon image est 200px et la hauteur de la zone est de 140px)). Vous pouvez donc choisir d'adapter apres votre zone "top" à votre image ou de commencer par prendre les infos de dimension de la zone pour créer votre image. c'est au choix !

En espérant avoir été claire ! Bon courage