COMMENT FAIRE UN JOLI TABLEAU 

SOURCE:  HTMLCODETUTORIAL   ( site:  http://www.htmlcodetutorial.com/tables/)

POUR FAIRE UN TABLEAU ON A BESOIN DE CES 3 BALISES

<TABLE>     <TR>     <TD>

<TABLE> 

On OUVRE notre tableau par  la balise  <TABLE>   et   on  TERMINE le tableau par  </TABLE>
Tout ce qui sera écrit dans le tableau se retrouve entre ces 2 balises 

<TR> 

Les  Lignes:   Écrire chacune des lignes entre les balises  <TR>   et  </TR>
Cette balise signifie en anglais ( Table  Row )  ce qui signifie: ( rangée du tableau) 
Ces balises doivent être écrite entre les balises <TABLE>et</TABLE>

<TD>   

Les Cellules:  Un tableau doit être composé de cellules .  Il faut écrire chacune des phrases
entre les balises  <TD>   et  </TD>
Cette balise signifie en anglais ( Table  Data)  ce qui signifie:  (rangée des données)
Ces balises doivent être écrite entre les balises  <TR>  pour chacune des cellules du tableau

____________________________________________________________________________________

Exemple d'un tableau sans bordure, avec 2 cellules par ligne:
<table>
<tr> <td>Isabelle</td>    <td>18 sept 1979</td>     </tr>
<tr> <td>Nadine</td>     <td>02 juin 1982</td>        </tr>
<tr> <td>Elizabeth</td>  <td>04 février 2008</td>  </tr>
<tr> <td>Geneviève</td>  <td>03 février 2010</td>  </tr>
<tr> <td>Maélie</td>       <td>18 janvier 2012</td>  </tr>
</table>

CE QUI DONNE:

____________________________________________________________________________________

<BORDER>    <RULES>  et  <FRAME>

Le contour:  Pour entourer le tableau et les cellules d'un contour on ajoute BORDER,

suivi du nombre désiré, à côté du mot TABLE  de la première balise <TABLE>. 
Ainsi:  <TABLE border 1> .
On obtient un contour simple en rajoutant :   Rules=none Frame=box
Cette balise signifie que la bordure entourant notre tableau aura 1 pixel.

Exemple d'un tableau avec une bordure SIMPLE de 1 pixel:
<table border=1 rules=none frame=box>
<tr>  <td>Isabelle</td>    <td>18 sept 1979</td>     </tr>
<tr> <td>Nadine</td>     <td>02 juin 1982</td>        </tr>
<tr> <td>Elizabeth</td>  <td>04 février 2008</td>  </tr>
<tr> <td>Geneviève</td>  <td>03 février 2010</td>  </tr>
<tr> <td>Maélie</td>       <td>18 janvier 2012</td>  </tr>
</table>

CE QUI DONNE

____________________________________________________________________________________

Pour entourer le tableau et les cellules d'un contour on
ENLÈVE  <RULES>  et  <FRAME>  du script ci-dessus

Exemple d'un tableau avec une bordure AUTOUR DE CHAQUE CELLULES:

CE QUI DONNE:                          

____________________________________________________________________________________

NUAGES DE TAG - Tag Clouds Generator

http://www.tag-cloud-generator.com/

http://www.tagcloud-generator.com/

AVATAR ANIMÉ -  Ajoute un avatar parlant sur votre site

http://www.voki.com/

AVATAR a votre image

http://unique.rasterboy.com/

TICKERS  COMPTE A REBOURS

http://lilypie.com/

http://tickers.baby-gaga.com/pregnancy.php

COMPTE A REBOURS

http://www.pyzam.com/toys/view/countdown

CALENDRIER ANIMAUX

http://www.magicwidgets.com/dogs-cats/

HORLOGES FLASH

http://friendster-tweakers.com/resources/friendster-flash-clock/

http://www.magicwidgets.com/flash-clocks/

http://perso.numericable.fr/~gabuzo38/good_time.html

HORLOGES - AFFICHER l'heure d'ailleurs en FLASH

http://24timezones.com/online_clock.php

SAINT DU JOUR

http://www.webmasteroo.com/saint-gratuit.php

STOKAGE DE PHOTOS EN LIGNE

http://www.archive-host.com/index.php

http://www.imageshack.com/

RUBAN AU COIN DROIT DE VOTRE SITE ( java script)

http://www.quickribbon.com/

BOUTONS

http://tools.dynamicdrive.com/button/

CADRE PHOTO INTER-ACTIF FLASH

http://www.magicwidgets.com/picture-frames/

MONUMENTS FUNÉRAIRES FLASH

http://www.magicwidgets.com/tombstome/

LOGO , TITRES, BOITES aux coins arrondis

http://creatr.cc/backgrounds/

http://www.supportduweb.com/generateur-coins-arrondis-html-css-rounded-box-corner-boxes-sommets-images-top-left-bottom-right.html

http://www.generateit.net/rounded-corner/

NOTE JAUNES A COLLER

http://wigflip.com/superstickies/

MONTAGE PHOTOS ANIMATION GIF

http://www.supportduweb.com/generateur-image-animee-gratuit-gifs-effet-creer-montage-photo-blog-gif.html

FREEWARE

http://www.gauget-family.net/Telecharger/Telecharger.html

ENCORE PLUS DE WIDGET

http://realia.jimdo.com/widgets-pour-jimdo/

A2A2A2A2A2A2A2A2A2A2A2A2A2A2A2A2A2A2A2A2A2

INFO SUR ('idcadre13'):

Couleur de fond du bouton:background-color: #f2f2f2;    
Couleur de l'ombre autour du bouton: box-shadow: 1px 1px 10px #808080;

Couleur de fond au toucher du bouton:  .bgColor='#4580c9'; 

222222222222222222222222222222222222222222222

222222222222222222222222222222222222222222222

3333333333333333333333333333333333333333333333

3333333333333333333333333333333333333333333333 

4444444444444444444444444444444444444444444444 

4444444444444444444444444444444444444444444444

5555555555555555555555555555555555555555555555

55555555555555555555555555555555555555555555555

Vous désirez mettre un ascenseur (scrollbar) dans un seul article.
Ouvrez votre article comme d'habitude et allez en mode HTML
en haut à gauche de l'article.  Coller ce code:
 

<div style="height: 250px; width: 650px; overflow: auto;">Ici votre article</div>

<div style="height: 200px; width: 600px; overflow: auto;">Ecrire votre article ICI  </div>

height =  La hauteur visible.   Ici on a utilisé 250px de haut.  Vous pouvez la changer à votre goût.
width = la largeur visible.  Vous pouvez utilisez la largeur si vous voulez un article plus étroit que
              votre colonne.  Dans cet exemple la largeur est 650px .  Avec cette largeur , quelque soit
              la grandeur de l'écran, la basse horizontale va apparaître au maximu.  Essayez de change
              de largeur si désiré.

Sortez du HTML et écrire votre article.  Voici ce que cela donne:

2222222222222222222222222222222222222222222222222222222222222222222222