106.284 visiteurs uniques depuis la création pour 1.966.617 articles lus

L'INFOBULLE, COMME SON NOM L'INDIQUE EST DESTINEE A DONNER AU LECTEUR L'INFORMATION VOULUE.

par André MARINI 21 Janvier 2016, 08:20 Texte

Une infobulle s'inscrit au passage de la souris sous forme d'un texte encadré et donne l'explication du croquis.

Le code comprend du html, en bleu et du CSS, en marron, compris entre les balises <style></style>.

CODE

<p><a class="info" href="#"><img src="http://data.over-blog-kiwi.com/1/30/51/51/20160121/ob_20de96_blog.jpg" /><span>VOICI, A MON SENS, LE MEILLEUR MONTAGE ET JE LE PRECONISE EN TOUTES CIRCONSTANCES.</span>
<style type="text/css">a.info{
position:relative;
z-index:24;
color:#000;
text-decoration:none
}
a.info:hover{
z-index:25;
background-color:#FFF
}
a.info span{
display: none
}
a.info:hover span{
display:block;
position:absolute;
top:2em; left:2em; width:15em;
border:1px solid #000;
background-color:#FFF;
color:#000;
text-align: justify;
font-weight:none;
padding:5px;
}
</style>
</a></p>