Avec la touche Ctrl

Avec la touche Alt

Avec la touche Windows

Avec les touches F1, F2, F3 etc...

Remplacer l'adresse URL par l'adresse URL de votre image et le texte par votre texte bien sûr !
Exemple :

<div style="background-image: url(http://img127.imageshack.us/img127/9845/ladydarkwl8.jpg)">

«Il n'est aucune sorte de sensation qui soit plus vive que celle de la douleur ; ses impressions sont sûres, elles ne trompent point comme celles du plaisir.» [ Marquis de sade ] - Extrait de Justine ou les malheurs de la vertu.

</div>

TEXTE AVEC MENU DEROULANT

<p><textarea style="FONT-SIZE: 10pt; COLOR: black; FONT-FAMILY: Verdana; BACKGROUND-COLOR: #ff0066" rows="20" cols="52" name="a"> Hommage &agrave; Sawtche la &laquo; V&eacute;nus hottentote &raquo;

Certaines ethnies comme les hottentots ont des fesses particuli&egrave;rement pro&eacute;minentes. Vous qui comme moi aimez les belles cambrures, les fascinantes croupes, comment ne pas rendre hommage &agrave; cette magnifique femme trait&eacute;e jadis comme du b&eacute;tail : la &laquo; V&eacute;nus hottentote &raquo; dont l&rsquo;histoire fut relat&eacute;e de nombreuse fois.

Saartjie Baartman de son vrai nom Sawtche, surnomm&eacute;e la V&eacute;nus Hottentote, serait n&eacute;e aux alentours de 1789 dans l'actuelle Afrique du sud originaire du peuple Kho&iuml;kho&iuml;

La pauvre Sawtche atteinte de st&eacute;atopygie (fesses surdimensionn&eacute;es) sous l&rsquo;exploitation d&rsquo;abord anglaise  terminera  sa vie dans les bordels et la mis&egrave;re le 29 d&eacute;cembre 1815 parisienne. Sa d&eacute;pouille sera rapatri&eacute;e Le 29 avril 2002 de France en Afrique du sud. La jeune femme est morte &agrave; Paris en 1816, &agrave; l&rsquo;&acirc;ge de 27 ans, apr&egrave;s y avoir &eacute;t&eacute; exhib&eacute;e comme une b&ecirc;te curieuse. Elle retrouva enfin une s&eacute;pulture et la dignit&eacute; qui est due &agrave; chaque &ecirc;tre humain.

Aujourd&rsquo;hui, elle est en Afrique du Sud le symbole de l&rsquo;humiliation subie par son peuple durant la colonisation. http://terresdefemmes.blogs.com

Pour moi c&rsquo;est une belle femme et je tenais &agrave; la montrer non pas en tant qu&rsquo;attraction mais en tant que merveilleuse femme diff&eacute;rente.

</textarea></p>
REMPLACEZ BIEN SÛR MON TEXTE QUE J AI GRISE PAR VOTRE TEXTE

TEXTE AVEC IMAGE EN FOND

A la place de l'adresse URL de mon image insérer évidemment la votre.

A la place de mon texte surligner en vert  insérer le votre

<div style="WIDTH: 390px"><img style="FILTER: alpha(opacity=100, finishOpacity=20,style=2); WIDTH: 590px; HEIGHT: 800px" height="800" alt="" src="http://img512.imageshack.us/img512/3759/fotomarche1pj8.jpg" width="390" align="right" />

<p>&nbsp;</p>

<div style="WIDTH: 400px; HEIGHT: 800px">

<p align="center">&nbsp; </p>

<p align="center"><font face="Arial, Cursive" color="#00ff00" size="5"></font></p>

<p align="center"><font face="Isabelle" color="#000000"><font color="#000000"><font face="Aria, Cursive" color="#000000" size="4">Il est des circonstances o&ugrave; vous ne vous appartenez plus. L'histoire que je vais vous raconter illustre bien ce propos. Cela lui est arriv&eacute;, lors d&rsquo;une rencontre, voici quelques ann&eacute;es. Lorsque je le vis, je sus instantan&eacute;ment qu&rsquo;une femme se cachait en lui. Lui, de son c&ocirc;t&eacute;, d&ucirc; sentir en moi la dominatrice &agrave; qui on peut tout dire &raquo;. Elle me raconta son histoire. Sa d&eacute;ception avec sa maitresse qui pr&eacute;f&eacute;rait le virtuel au r&eacute;el. Il me confia leurs correspondances. Un grand signe de confiance, je le savais. </font></font>

<p align="center"><font size="4"><br /></font></p>

</font></p>

</div>

</div>

Défilement de texte ou Défilement d’images

Pour faire défiler phrases ou images, la balise est <marquee>. Vous devez donc inscrire le code HTLM ci-dessous dans le langage source de votre blog.

- Cliquer sur " Accéder aux fonctions avancées"
- Cliquer sur " Editer la source"
- Copiez-collez la phrase ci-dessous, à l'endroit où vous souhaitez voir défiler votre phrase, en tappant votre texte entre les balises "marquee"

<marquee>VOUS INSCRIVEZ VOTRE TEXTE</marquee>

Toujours dans le langage source de votre blog :

<marquee><img src="URL de l'image"></marquee>

Vous trouverez l'URL de votre image en faisant un clic droit sur celle-ci, " propriétés de l'image ", et vous copiez le code URL inscrit dans le rectangle. Vous le collez à la place de "URL de l'image", entre les balises marquee.

pour faire apparaître une image en passant votre souris sur un mot. Cette méthode est adaptée de l'article Infobulle (Popup) en CSS.

Exemple

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed dignissim eros Survolez-moi nisl. Cras et tortor sed nisl auctor placerat. Morbi et quam id neque blandit pellentesque. Ut nisi ipsum, pretium ac, pretium a, pulvinar adipiscing, nisi. Nulla facilisi. Donec vehicula tellus sed enim. Morbi consequat, augue sed vulputate adipiscing, velit risus vestibulum odio, quis adipiscing

En plaçant le curseur de votre souris sur le mot souligné en pointillé vous verrez apparaître une image.

Comment faire

Pour obtenir ce résultat vous devez procéder en 2 ètapes:

• La première, vous devez ajouter dans votre CSS (au niveau des éléments principaux) le code suivant:

CSS

a.viewpic {
  position:relative;
  border-bottom:1px dashed #808080;
  text-decoration: none;
}
a:hover.viewpic {
  text-decoration: none;
  background: none;
}
a.viewpic span {display: none;}

a:hover.viewpic span {
  display: inline;
  position: absolute; 
  top: -20px;
  left: 10px;
  z-index: 20;
  width:100%;
  padding:2px 4px;
}

• La deuxième, dans vos articles, chaque fois que vous voulez insérer une image comme cell-ci au survol d'un mot ou d'une expression, il suffit de mettre le code suivant en mode source:

HTML

<a class="viewpic" href="#">Survolez-moi<span><img src="url_image.jpg" alt="" /></span></a>

<a class="viewpic" href="#"> <span><img src="url_image.jpg" alt="" /></span></a>

Exemple : <p><a class="viewpic" href="#">L&rsquo;Eternelle destin&eacute;e <span><img style="WIDTH: 52px; HEIGHT: 50px" height="104" alt="" src="http://img71.imageshack.us/img71/3774/gifartuk9.gif" width="108" /></span></a></p>

Exemple : <p><a class="viewpic" href="#"> <span><img style="WIDTH: 52px; HEIGHT: 50px" height="104" alt="" src="http://img71.imageshack.us/img71/3774/gifartuk9.gif" width="108" /></span></a></p>

Pour aller plus loin

Si vous voulez modifier la position de l'image, dans le CSS, modifiez les valeurs des propriétés top et left.

http://img71.imageshack.us/img71/3774/gifartuk9.gif