POUR FAIRE VOTRE PROPRE CADRE ASCENSEUR DE PHOTOS
PARCE QU'IL Y A TROP D'IMAGES à afficher ET PAS ASSEZ D'ESPACE
N'oubiez pas d' ajuster la taille du cadre et des photos selon la largeur de vos colonnes de blog.
a) Images - Choisissez la taille de vos images. Disons « 460 x 340 »
b) Cadre - Vous ajouterez environ 40 pixels de plus pour le pourtour du cadre. Exemple: 480 x380
c) Téléchargez les photos dans vos Documents
d) Notez l'adresse URL de chacune des images téléchargées.
e) Ouvrez un document word ou word pad et copiez le code ci-dessous en ajoutant la hauteur
et la largeur de VOTRE CADRE et de VOS PHOTOS et vos adresses URL.
<div style="border: 2px solid #ffffff; overflow: scroll; width: 480px; height: 380px; background-color: #ffffff;" align="left">
<span style="font-size:10pt">
<img src="http://VOTRE Premier URL ICI.jpg" style="width: 460px; height: 340px;" border="0" />
<br />^ NOM DE VOTRE IMAGE1<br />
<img src="http://VOTRE Deuxième URL ICI.jpg" style="width: 460px; height: 340px;" border="0" /><br />^ NOM DE VOTRE IMAGE2<br />
<img src="http://VOTRE Troisième URL ICI.jpg" style="width: 460px; height: 340px;" border="0" /><br />^ NOM DE VOTRE IMAGE3<br />
</span>
</div>
5 – Allez en haut à gauche à HTML et collez votre code
Pour insérer plus d'images:
Vous n'avez qu'a copier-coller la dernière ligne et modifier VOTRE Quatrième URL d'image et le NOm de l'image.
Toujours terminer par
</span>
</div>
Vous aurez quelque chose comme ceci:
Voici le code :
<div style="border: 2px solid #ffffff; overflow: scroll; width: 480px; height: 380px; background-color: #ffffff;" align="left"><span style="font-size:10pt"><img src="http://VOTRE Premier URL ICI.jpg" style="width: 459px; height: 344px;" border="0" /><br /> ^ NOM DE LA PHOTO 1 ICI<br /> <img src="http://VOTRE Deuxième URL ICI..jpg" style="width: 459px; height: 344px;" border="0" /><br /> ^ NOM DE LA PHOTO2 ICI<br /> <img src="http://votre Troisième URL ICI.jpg" style="width: 459px; height: 344px;" border="0" /><br /> ^ NOM DE LA PHOTO 3 ICI<br /></span></div>
POUR COMPRENDRE LE CODE
<div Ce code sert à créer la division dont la mise en forme en fera un cadre.
DÉBUT DU STYLE DE NOTRE CADRE:
style="border: 2px solid #ffffff; Ce code sert à déterminer le style du cadre: ainsi, la bordure aura 2 pixels
d'épaisseur, en trait continu (solid) , et sera de couleur blanche.
overflow: scroll; C'est le principal. Si le flux déborde, on fera défiler (scroll).
width: 480px;height: 380px; Le cadre fera 480 pixels de large pour 380 pixels de haut.
background-color: #ffffff;" L'arrière-plan sera blanc
FIN DU STYLE DE NOTRE CADRE
ALIGNEMENT:
align="left"> On alignera à gauche.
<span Ce code créera une rupture dans la feuille de style courante.
style="font-size:10pt"> La taille des caractères sera de 10 points.
INSERTION DEs IMAGEs - ( on en précise la taille) et on les nomme
FERMETURE DU CADRE
</span> Avec 'SPAN' on ferme la rupture dans la feuille de style.
</div> Avec ' DIV' on ferme la division, et donc le « cadre ».
JOUER À BUBBLE
