Français English 
accueil-wubijacq.com
Logiciels gratuits
install xnviewMP on ubuntu
créer un gif animé
mtPaint et gifsicle en action
HTML pur code
creer un paquet DEB
partage de fichiers entre Windows et Ubuntu avec Wubi
Sun VirtualBox
repixelisation de vos photos
icônes de bureau Linux
applications en ligne
THX  Georges Lucas
rentabiliser son site
HTML5
RecordMyDesktop
Vista-CMD
Shockwave Flash quelques outils
eco-déballages
ifrancepro
Caral 1000ans de paix
Faire un don - Envoi de fichiers
divertissement
téléchargements

          Encadrer du texte  en HTML pur code



Renvoyé vers le frameset ,  cadres avec word , cadres avec openoffice , cadres avec le PHP etcetera et même un cheval de Troie en prime sur un site en cherchant cette chose toute simple : comment encadrer du texte en .html . En espérant être référencé correctement par les moteurs de recherche voici le code en HTML pur code . Tout naturellement qui dit cadre dit tableau ......et puis les listes pour finir de ranger et classer

encadrer un texte

pour encadrer un texte
il suffit de faire un tableau
avec une seule cellule

  le code

<table width="100%" border ="1" cellspacing="1" cellpadding="1"><tr><td><div align=center>pour encadrer un texte<br>il suffit de faire un tableau<br>avec une seule cellule</div></td><tr></table>

  Tableau avec 3 cellules

La première balise à insérer pour la création d'un tableau est <table></table>
<tr> </tr> crée une rangée alors que <td></td> crée une nouvelle colonne. A insérer entre les balises BODY , là où vous voulez que ce tableau apparaisse
cellule1
cellule2
cellule3


le code

<table width="100%" border="1" cellspacing="1" cellpadding="1" >
<tr><td><div align="center">cellule1 </div> </td>
<td><div align="center">cellule2</div> </td>
<td><div align="center">cellule3</div> </td></tr>
</table>

Faire une grille
3 rangées et 3 colonnes

<tr></tr>crée une rangée <th></th>une cellule en gras
Cellules du hautcellule1cellule 2
Cellules vides
cellules du bascellule 6

le code

<table border=1 width=100% cellspacing=1 cellpadding=1 <tr><th>Cellules du haut</th><td>cellule1</td><td>cellule 2</td></tr><tr><th>Cellules vides</th><td></td><td></td></tr><tr><th>cellules du bas</th><td></td><td>cellule 6</td></tr></table>

Un formulaire de contact

ce formulaire en HTML appelle une page en PHP nommée ici contact.php, que je n'ai pas installée pour éviter les spams
nom:
email:
objet:
message:

le code

<form method=POST action=contact.php >
<input type=hidden name=subject value=contact>
<table border=1>
<tr><td>nom:</td>
<td><input type=text name=realname ></td></tr>
<tr><td>email:</td>
<td><input type=text name=email title="entrer une adresse valide" value="@" /></td></tr>
<tr><td>objet:</td>
<td><input type=text name=title ></td></tr>
<tr><td colspan=2>message:<br>
<textarea COLS=30 ROWS=8 name=comments></textarea>
</td><tr>
<td> <input type=submit value=Envoyer >
</td></tr>
</table>
</form>

tableau avec un questionnaire

Pour ne pas voir les traits de séparation : table border=0  avec les boutons radio (ronds) vous n'avez qu'un seul choix avec les checkboxes (carrés) cochez autant de réponses que vous désirez . select vous offre un menu déroulant . Mais pour avoir le maximum d'efficacité et de sécurité il vaut mieux  coupler avec un fichier PHP comme le formulaire de contact plus haut.

(cours de yoga)

Enregistrement d'une inscription
Nom
Prénom
*email
Sexe Homme :
Femme:

Autre (précisez dans les motivations)
Fonction
Motivations
                                                                                                                                      retour haut de page

le code

<form name="yoga" method="post" action="mailto:toto@mail.fr">
<b>Enregistrement d'une inscription</b>
<table border=1>
<TR><TD>Nom</TD>
<TD><input type=text name="nom"></TD></TR>
<TR><TD>Prénom</TD>
<TD><input type=text name="prenom"></TD></TR>
<TR><TD>*email</td><td> <input type=text name="email"></TD></TR>
<TR><TD>Sexe</TD>
<TD>Homme : <input type=radio name="sexe" value="M">
<br>Femme: <input type=radio name="sexe" value="F">                                                                  <br><br>Autre (précisez dans le commentaire)<input type=checkbox name="sexe"value="A"
</TD></TR><TR><TD>Fonction</TD><TD><SELECT name="fonction">
<option value="enseignant">Enseignant</option>
<option value="etudiant">Etudiant</option>
<option value="ingenieur">Ingénieur</option>
<option value="retraite">Retraité</option>
<option value="autre">Autre</option>
</SELECT></TD></TR><TR><TD>motivations</TD>
<TD><textarea rows="3" name="motivations">
santé rencontres spiritualité</textarea></TD></TR>
<TR><TD COLSPAN=2><input type="submit" value="Envoyer"></TD></TR>
</TABLE>
</form>

Les listes

avec les balises <li>...</li> seulement

Titre de la liste
  • bla bla bla
  • ble ble ble
  • bli bli bli
    •                     

    code

    <Ih>Titre de la liste</Ih><li>bla bla bla</li><li>ble ble ble</li><li>bli bli bli</li>

    avec <ul> devant

    • bla bla bla
    • ble ble ble
    • bli bli bli

    code

    <ul><li>bla bla bla</li><li>ble ble ble</li><li>bli bli bli</li></ul>

    avec <ol> devant

    1. bla bla bla
    2. ble ble ble
    3. bli bli bli
    retour haut de page

    code

    <ol><li>bla bla bla</li><li>ble ble ble</li><li>bli bli bli</li></ol>

    avec <ul type=none> devant

    • bla bla bla
    • ble ble ble
    • blu blu blu

    code

    <ul type=none><li>bla bla bla</li><li>ble ble ble</li><li>blu blu blu</li></ul>

    avec <ul type=square> devant

    • bla bla bla
    • bli bli bli
    • blu blu blu

    code

    <ul type=square><li>bla bla bla</li><li>bli bli bli</li><li>blu blu blu</li></ul>

    avec <ul type=circle> devant

    • bla bla bla
    • bli bli bli
    • blu blu blu

    code

    <ul type=circle><li>bla bla bla</li><li>bli bli bli</li><li>blu blu blu</li></ul>

    Tableaux stylisés avec les balises SPAN

    Mettre des couleurs  personnaliser ses tableaux avec les balises SPAN

    Click here to subscribe to this RSS feed
    Site web créé avec Lauyan TOWebDernière mise à jour : mardi 25 octobre 2011