Glénan
Finistère
Bretagne

L'archipel des Glénan à Fouesnant

une production
LÉOST Informatique
Nouvelle version 2016 du site sur Glenan.fr
[Accueil] [Glénan] [Fouesnant] [Textes] [Séjours] [Visite virtuelle] [Jeux] [ Formation] [Bonus]

Formation multimédia

[Accueil] [PowerPoint] [FrontPage] [Dreamweaver] [Contribute] [Traitement image] [Flash] [HTML]

HTML

[Mémento HTML] [Exemple : les Glénan 1] [Les Glénan 1 commentés]

Information de la page "Les glénan : exemple HTML"

afin de faciliter la recherche du code, chaque chapître ( la balise <h2>) est accessible

code HTML Explications
<html> début de la page
<head> La tête de la page qui contient des informations utiles pour le navigateur et les robots d'indexation.
<title>Les Gl&eacute;nan : exemple HTML</title> Le titre de la page qui apparaît dans votre navigateur
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
Définition des caractères utilisés dans la page
<meta name="keywords" content="glénan, glenan, saint-nicolas, loc'h, penfret, cigogne, fort cigogne, CNH, CIP, eau, énergie, goéland, goeland">
<meta name="description" content="Les Glénan : exemple de mise en forme HTML">
<meta name="author" content="Philippe LÉOST">
La meta name description et keywords servent pour le référencement
</head> fin de la tête

Début de la page (haut)

<body bgcolor="#83C7FD" text="#0A0B81" link="#2878BB" vlink="#FFFFFF" alink="#0A0B81" topmargin="0"> le corps de la page avec une définition des couleurs du fond et des différents types de texte. Il n'y a pas d'image d'arrière plan
<div align="center"> Tous ce qui est dessous sera centré à l'écran
<embed src="images/MER.MID" height="0" width="0" loop="true" controller="false">
</embed>

chargement et lecture en boucle sans contôleur avec une taille à 0. Le fait de forcer la taille à 0 évite l'apparition temporaire du contrôleur multimédia à l'écran. 266 octets pour simuler une vague numérique ;-)

<br> Comme topmargin="0", pour éviter que le titre colle au haut de la fenêtre du navigateur, un saut de ligne forcé est introduit là. Il aurait été plus judicieux de ne mettre ni topmargin, ni <br>
</div> fin de la division centré
<h1 align="center"><font face="Geneva, Arial, Helvetica, san-serif">LES GL&Eacute;NAN</font></h1> Titre de niveau 1, avec les 3 déclinaisons de police dans l'ordre de préférence
<hr size="10" width="300"> Règle horizontale de 300 pixels de large et 10 de haut
<p>Voir le début de paragraphe
<a href="HTML_comment1.htm">code HTML comment&eacute;</a> lien hypertexte relatif vers la page que vous lisez
de cette page et le  
<a href="HTML_Memento.htm">m&eacute;mento HTML</a> lien relatif vers la page mémento
.</p>
<p>A 20 km en mer, au large de FOUESNANT, l'archipel des GL&Eacute;NAN. </p>
<p align="center">
GLÉNAN
<img src="images/Glenan-carte.gif" width="600" height="425" alt="Carte des Gl&eacute;nan" usemap="#Glenan" border="0"> chargement d'une image (carte des Glénan) de 600x425 pixels avec une balise alternative et une carte de liens
<map name="Glenan"> Définition de la carte de lien
<area shape="circle" coords="283,247,24" href="#Cigogne" alt="Fort Cigogne">
<area shape="circle" coords="273,346,49" href="#Le_Loch" alt="Le Loc'h">
<area shape="rect" coords="204,155,278,204" href="#Saint_nicolas" alt="Saint Nicolas">
<area shape="poly" coords="522,167,559,209,528,285,507,298,489,244,522,167" href="#Penfret" alt="Penfret">
<area shape="rect" coords="114,296,197,339" alt="Quign&eacute;nec">
<area shape="rect" coords="157,218,235,266" alt="Dr&eacute;nec">
<area shape="rect" coords="348,335,409,381" alt="L'&icirc;le aux oiseaux">
<area shape="rect" coords="411,260,483,297" alt="Guiautec">
<area shape="rect" coords="256,172,326,212" alt="Bananec">
<area shape="rect" coords="219,115,277,151" alt="&quot;La Prison&quot;">
liste des zones de lien de la carte. Toutes les zones ont une balise alternative permettant l'affichage d'une infobulle. les 4 premières zones pointent vers un signet au sein de la page courrante
</map> fin de la définition de lien
</p>
<p>Les principales &icirc;les sont : </p>
 
<ol> définition de liste numéroté
<li><a href="#Saint_nicolas">SAINT-NICOLAS</a> </li>
<li><a href="#Cigogne">FORT-CIGOGNE</a> </li>
<li><a href="#Penfret">PENFRET </a></li>
<li><a href="#Le_Loch">LE LOC'H</a> </li>
<li>BANANEC </li>
<li>DRENEC </li>
<li>GUIAUTEC </li>
liste numérotée des îles avec un lien relatif sur ancre (signet ) pour les 4 premières
</ol> fin de liste numérotée
<p>et d'autres &icirc;lots comme LA PRISON</p>
<p align="center">
 
<embed src="images/glenan.avi" width="240" height="226" alt="Désolé ! Il faut un lecteur compatible..." autoplay="false" controller="true" cache="true">
</embed>
chargement d'une vidéo de 240x180 pixels dans une zone plus grande (240x226) de façon à permettre de voir le contrôleur. Le film ne démarre pas tout seul
</p>  

Saint Nicolas(haut)

<h2><font face="Verdana, Arial, Helvetica, sans-serif"> Titre de niveau 2, avec les 3 déclinaisons de police dans l'ordre de préférence
<img src="images/saint-nicolas.jpg" width="300" height="200" align="right" alt="Saint-Nicolas et Bananec"> Insertion de l'image de St Nicolas avec un alignement à droite
SAINT NICOLAS Texte
<a name="Saint_nicolas"></a> Ancre (ou signet) "St Nicolas"
</font></a></h2> fin de balise
<p>C'est l&agrave; que les vedettes accostent pour d&eacute;barquer les passagers. Malheureusement
pour eux, les touristes ne pourront pas visiter les autres &icirc;les de l'archipel.
</p>
paragraphe
<h3> Titre niveau 3
<img src="images/nicolas-detail.jpg" width="350" height="229" align="left" usemap="#Saint_Nicolas" border="0"> Insertion de la vue aériene de la cale et de la carte (usemap)
<map name="Saint_Nicolas"> Définition de la carte
<area shape="circle" coords="72,31,44" href="#electricite" alt="&Eacute;olienne et panneaux soliare">
<area shape="rect" coords="113,51,170,88" href="#CIP" alt="Le Centre International de Plong&eacute;e">
<area shape="rect" coords="284,99,355,136" href="#NEF" alt="Le relais de La NEF">
<area shape="poly" coords="190,111,219,88,204,74,173,96,190,111" href="#" alt="La Boucane">
<area shape="poly" coords="188,165,148,157,147,144,179,126,183,115,205,117,206,125,226,129,188,165" href="#viviers" alt="Les Viviers">
Liens et balise alternatives sur la photo des viviers
</map> fin de balise
Les viviers Texte
<a name="viviers"></a> Ancre (ou signet) "Viviers"
</h3> fin de balise
<blockquote> retrait de paragraphe
<p>En 1870 construction d'un vivier &agrave; crustac&eacute;s (homards, langoustes,
crabes). Les p&ecirc;cheurs y d&eacute;posent leurs captures qui seront vendues
&agrave; Paris. Aujourd'hui les viviers sont la propri&eacute;t&eacute; de
Jean Castric. Les crustac&eacute;s sont servis dans son restaurant qui surplombe
les viviers. </p>
paragraphe
</blockquote> fin de balise
<h3>La boucane <a name="Boucane"></a></h3> Titre niveau 3

<blockquote>
<p>Un abri pour le canot de sauvetage a &eacute;t&eacute;construit en 1881.
On avait nomm&eacute;le bateau de sauvetage : ALPHONSE BUQUET. On avait construit
des rails pour pouvoir glisser plus facilement le bateau &agrave; la mer.
Quelques ann&eacute;es plus tard l'abri du canot de sauvetage a &eacute;t&eacute;
transform&eacute; en restaurant : LA BOUCANE. </p>
</blockquote>

retrait de paragraphe
<h3>Le CIP <a name="CIP"></a></h3> Titre niveau 3
<blockquote>
<p>Le <b><i>C</i></b><i>entre <b>I</b>nternational de <b>P</b>long&eacute;e
des GLENAN</i> est connu dans le monde entier. L'&eacute;t&eacute;, de nombreux
stagiaires y viennent pour apprendre &agrave;plonger. On y a vu par exemple,
quelques hommes de la gendarmerie allemande. </p>
</blockquote>
retrait de paragraphe
<h3>NEF<a name="NEF"></a> </h3> Titre niveau 3
<blockquote>  
<p><i><b>N</b>autisme <b>E</b>n <b>F</b>inist&egrave;re</i>. Ce relais
accueille les membres des centres nautiques de la r&eacute;gion.C'est l&agrave;
que nous s&eacute;journerons. </p>
NEF en italique et première lettre en gras

<h4>Le probl&egrave;me de l'eau </h4>
Titre niveau 4
<blockquote>
<p>Il n'y a pas d'eau (H<sub>2</sub>O) potable au relais de la NEF. <br>
L'eau de pluie est recueillie dans deux citernes.Elle n'est pas potable.
Il faut donc emporter de l'eau potable avec nous. L'eau des citernes sert
pour la toilette et la cuisine. Elle ne doit pas &ecirc;tre gaspill&eacute;e.
</p>
</blockquote>
retrait de paragraphe
<h4>Le probl&egrave;me de l'&eacute;lectricit&eacute;<a name="electricite"></a></h4> Titre niveau 4
<blockquote>
<p>Depuis 2 ou 3 ans, le relais de la NEF est &eacute;lectrifi&eacute; gr&acirc;ce
&agrave; une &eacute;olienne et &agrave; des panneaux solaires. Avant, les
gens s'&eacute;clairaient au gaz ou &agrave; la bougie.</p>
</blockquote>
retrait de paragraphe
</blockquote> fin de balise
<h3>Narcisses </h3> Titre niveau 3
<blockquote>
<p>Sur l'&icirc;le Saint-Nicolas, pousse une plante unique au monde : <TT><b>le
narcisse</b></TT> des Gl&eacute;nan. On n'en trouve nulle part ailleurs. Comme
des visiteurs en arrachaient pour tenter de les faire pousser dans leurs jardins,
il a fallu prot&eacute;ger la zone. Pendant la mauvaise saison, 3 &acirc;nes
broutent les foug&egrave;res, les ronces et autres plantes qui envahissent
la zone des narcisses. Pendant la p&eacute;riode de pouss&eacute;e des plants,
les &acirc;nes vivent sur le reste de l'&icirc;le, avec...d'autres &acirc;nes!
</p>
</blockquote>
retrait de paragraphe avec Narcisse en police non proportionnelle

Le Loc'h(haut)

<h2><font face="Verdana, Arial, Helvetica, sans-serif"><img src="images/loch.jpg" width="300" height="198" align="right" alt="Le Loc'h - au nord Guignenec - au nord-est Drenec">LE LOCH <a name="Le_Loch"></a></font></h2> Titre de niveau 2, avec définition de police, d'une image avec balise alternative dans le titre, d'une ancre (signet)
<p>Elle est la propri&eacute;t&eacute; de monsieur <i><b><font face="Courier New, Courier, mono" size="+1">BOLLOR&Eacute;</font></b></i>
qui y poss&egrave;de une maison. L'&icirc;le n'est pas habit&eacute;e toute
l'ann&eacute;e. Au milieu se trouve un &eacute;tang d'eau saum&acirc;tre. </p>
Taille augmenté de 1 pour Gwen-Aël Bolloré
<table width="75%" border="0" cellspacing="1"> Tableau sans bordure, donc pas visible (au premier coup d'oeil)
<tr> définition de la première ligne
<td valign="top" width="12%">1784&nbsp;:</td> Définition de la cellule ; texte aligné en haut ; largeur de 10% ; avec une espace insécable après la date, pour séparer la date de la suite du texte (une valeur à cellpadding aurait été presque équivalent)
<td width="88%">installation d'une usine &agrave; l'&icirc;le du LOC'H. des
ouvriers brûlent du go&eacute;mon ( varech ) pour fabriquer de la soude.
Celle-ci est utilis&eacute;e pour la fabrication du verre. </td>
Nouvelle cellule de 88% de large
</tr>
<tr>
Fin de ligne et nouvelle ligne
<td valign="top" width="12%">1874&nbsp;:</td>
<td width="88%">construction d'un four et d'une haute chemin&eacute;e pour
brûler le go&eacute;mon et &eacute;viter les mauvaises odeurs qui g&ecirc;nent
les habitants des &icirc;les.</td>
définition des 2 cellules de la ligne

</tr>
<tr>

Fin de ligne et nouvelle ligne
<td valign="top" width="12%">1882&nbsp;:</td><td width="88%">arr&ecirc;t de la fabrication de la soude. </td> définition des 2 cellules de la ligne
</tr>
</table>
Fin de ligne et de tableau
<p>Les tombes pr&eacute;historiques: elles servent parfois aux go&eacute;lands qui y font leurs nids. </p>
<p>Les oiseaux du LOC'H&nbsp;: </p>
2 paragraphes
<ul> début de liste à puce
<li>des go&eacute;lands tr&egrave;s nombreux </li>
<li>des hu&icirc;triers-pies </li>
<li>des tourne-pierres </li>
<li>des sternes </li>
<li>des canards </li>
<li>et bien d'autres. </li>
item de la liste
</ul> fin de balise

Cigogne(haut)

<h2><font face="Verdana, Arial, Helvetica, sans-serif">CIGOGNE<a name="Cigogne"></a> </font></h2> Titre niveau 2 avec définition de police et ancre
<table width="0%" border="0" cellspacing="1" background="images/cigogne.jpg"> Tableau avec image en fond d'écran
<tr> debut de ligne
<td valign="top" align="right" width="78"><b>XIV<sup>&egrave;me</sup> s. :</b></td> cellule de 78 pixels de large avec ème en exposant et alignement en haut et à droite
<td width="491"><b>&eacute;poque de Louis XIV Les corsaires anglais et hollandais se servent de la "chambre" comme base pour attaquer les navires de marchandises.
L'id&eacute;e circule de construire un fort.</b></td>
cellule de 491 pixels de large
</tr>
<tr>
fin et début de ligne

<td valign="top" align="right" width="78"><b>1756 :</b></td>
<td width="491"><b>construction du fort. 80 soldats l'occupent pendant 6 ans.</b></td>

cellules de 78 et 491 pixels de large
</tr>
<tr>
 
<td valign="top" align="right" width="78"><b>En 1762,</b></td>
<td width="491"><b>les soldats quittent le fort, en y laissant un gardien.</b></td>
cellules de 78 et 491 pixels de large
</tr>
<tr>
fin et début de ligne
<td valign="top" align="right" width="78"><b>1793 :</b></td>
<td width="491"><b>guerre contre l'Angleterre. 50 hommes viennent au fort.
Ils ont des canons. Les Anglais s'installent &agrave; Penfret car les canons
français ne tirent pas assez loin.</b></td>
cellules de 78 et 491 pixels de large
</tr>
<tr>
fin et début de ligne
<td valign="top" align="right" width="78"><b>1814 :</b></td>
<td width="491"><b>les soldats quittent FORT-CIGOGNE</b></td>
cellules de 78 et 491 pixels de large
</tr>
<tr>
fin et début de ligne
<td valign="top" align="right" width="78"><b>1891 :</b></td>
<td width="491"><b>des chercheurs scientifiques viennent &eacute;tudier la
faune et la flore.</b></td>
cellules de 78 et 491 pixels de large
</tr>
<tr>
fin et début de ligne

<td valign="top" align="right" width="78" background="images/cigogne-amer.jpg" height="83"><b>1911 :</b></td>
cellule avec image de fond de cellule de l'amer de Fort Cigogne. La balise TR ne peut pas être utilisée pour mettre une image d'arière plan (non fonctionnel avec IE)
<td width="491" height="83"><b>construction sur le fort d'une tour de plus
de 20 m de haut, un amer qui sert de rep&egrave;re aux marins.</b></td>
 
</tr>
<tr>
fin et début de ligne
<td valign="top" align="right" width="78"><b>1914-1918 :</b></td>
<td width="491"><b>pendant la guerre, des Concarnois occupent Fort-Cigogne.
Ils n'auront que quelques prob&egrave;mes de ravitaillement.</b></td>
cellules de 78 et 491 pixels de large
</tr>
<tr>
fin et début de ligne
<td valign="top" align="right" width="78"><b>1939-1945 :</b></td>
<td width="491"><b>Une petite troupe allemande occupe le fort. RAS.</b></td>
cellules de 78 et 491 pixels de large
</tr>
<tr>
fin et début de ligne
<td valign="top" align="right" width="78" background="images/cigogne-CNG.jpg" height="80"><b>1996 :</b></td> cellule avec image de fond de cellule d'un bateau devant de Fort Cigogne.
<td width="491" height="80"><b>FORT-CICOGNE l'une des bases du C N G. (Centre
Nautique des Gl&eacute;nans)</b></td>
cellule de 491 pixels de large et de 80 pixels de haut
</tr>
</table>
fin de ligne et de tableau

Penfret(haut)

<h2><font face="Verdana, Arial, Helvetica, sans-serif">PENFRET <a name="Penfret"></a></font></h2> Titre de niveau 2 avec police et ancre
<h3>Le phare</h3> Titre de niveau 3
<p>Il est allum&eacute; pour la premi&egrave;re fois le premier octobre 1838.
Il automatis&eacute; depuis 1994. A c&ocirc;t&eacute; se trouve la maison des
gardiens, inoccup&eacute;e. Le phare est construit sur des fortifications. </p>
Paragraphe
<h3>CNG</h3> Titre de niveau 3
<p>PENFRET est une des base du centre nautique. </p> Paragraphe
<h3>Le tunnel</h3> Titre de niveau 3
<p>Il existe un tunnel qui part du fort pour aller pr&egrave;s de la c&ocirc;te.
Il a &eacute;t&eacute; construit pour permettre aux occupants de fuir en cas d'attaque. </p>
Paragraphe

Sa majesté le Goéland(haut)

<h2><font face="Verdana, Arial, Helvetica, sans-serif"><img src="images/goel-vol.gif" width="157" height="200" hspace="50" align="right" alt="Le vol du Go&eacute;land">SA
MAJESTE LE GO&Eacute;LAND </font></h2>
Titre de niveau 2, avec définition de police, d'une image avec balise alternative dans le titre
<p>Aux &icirc;les, on peut voir 2 sortes de go&eacute;lands&nbsp;: </p> Paragraphe
<ul type="square"> Liste à puces^ avec le symbole carré
<li><font color="seashell">le go&eacute;land argent</font></li>
<li><font color="seashell">le go&eacute;land brun </font></li>
<li><font color="seashell">et rarement le go&eacute;land marin. </font></li>
Items de la liste à puces
</ul> fin de balise
<p>Les go&eacute;lands sont si nombreux qu'ils ont chass&eacute; d'autres esp&egrave;ces de l'archipel (sternes). Ils occupent toutes les &icirc;les. </p> Paragraphe
<table width="0%" border="5" cellspacing="6" cellpadding="3" bgcolor="bisque"> Tableau d'une largeur de 0% (la taille serat augmentée par le contenu des cellules), avec un espace inter et intra cellulaire de couleur bisque.
<tr> Début de ligne
<th width="128" bgcolor="seashell">NID :</th> Cellule de 128 pixel de large de couleur "coquillage"
<td width="672">il est fait avec des brindilles et des d&eacute;bris de plantes.
Ce n'est pas une oeuvre d'art&nbsp;!</td>
Cellule de 672 pixels de large
<td rowspan="2" width="251" bgcolor="seashell"><font><img src="images/goel-nid.jpg" width="250" height="209" alt="Oeuf de go&eacute;land"></font></td> fusion de 2 cellules en hauteur. Hauteur =209 et largeur = 250 (taille de la photo)
</tr>
<tr>
fin et début de ligne
<th width="128" bgcolor="seashell">&#140;UFS :</th> Cellule de 128 pixel de large de couleur "coquillage"
<td width="672">la femelle pond 2 ou 3 &#156;ufs en mai/juin. Les parents
couvent &agrave; tour de r&ocirc;le pendant 26 &agrave; 28 jours.</td>

Cellule de 672 pixels de large.
La cellule suivante est déjà fusionnée avec la cellule de la ligne précédente

</tr>
<tr>
fin et début de ligne
<th width="128" bgcolor="seashell">GRISARD :</th> Cellule de 128 pixel de large de couleur "coquillage"
<td width="672">au bout d'un jour, le petit du go&eacute;land, le grisard,
marche et se cache dans les rochers. Il sera nourri par ses parents jusqu'&agrave;
l'&acirc;ge de 42 jours. Quand le petit veut manger, il donne des coups
sur la t&acirc;che rouge du bec de ses parents. Le parent r&eacute;gurgite
(vomit) alors la nourriture pour son petit.</td>
Cellule de 672 pixels de large.
La cellule suivante est déjà fusionnée avec la cellule de la ligne précédente
<td width="251" bgcolor="seashell"><img src="images/goel-grisard.jpg" width="250" height="179" alt="Grisard"></td> Cellule avec Hauteur =179 et largeur = 250 (taille de la photo)
</tr>
<tr>
fin et début de ligne
<th width="128" bgcolor="seashell">NOURRITURE :</th> Cellule de 128 pixel de large de couleur "coquillage"
<td width="672">le go&eacute;land se nourrit de poissons, de boyaux, de d&eacute;bris.
On le voit beaucoup dans les d&eacute;charges. On a m&ecirc;me vu un go&eacute;land
r&eacute;gurgiter un coton-tige&nbsp;!</td>
Cellule de 672 pixels de large.
La cellule suivante est déjà fusionnée avec la cellule de la ligne précédente
<td width="251" bgcolor="seashell"><img src="images/goel.jpg" width="250" height="209" alt="Go&eacute;land sur nid"></td> Cellule avec Hauteur =209 et largeur = 250 (taille de la photo)
</tr>
</table>
fin de ligne et de tableau
<hr noshade> ligne de séparation de couleur unie
<p align="right">Texte extrait d'un CD-Rom r&eacute;alis&eacute; en 1995-96 et
d'un
Paragraphe aligné à droite
<a href="http://www.bagadoo.tm.fr/kerourgue/">site interne</a> Lien vers le site Bagadoo de la technopole de Quimper
t r&eacute;alis&eacute; en 1996-97 par des enfants de CM2.</p>
<p align="right">Avec l'aimable autorisation de
paragraphes
<i><b><font face="Courier New, Courier, mono" size="+1"> Gras italique avec police courrier de taille +1 par rapport à la normal (4 = 3 + 1)
<a href="mailto:gerard.marie.guillou@wanadoo.fr"?subject="formation HTML - Glénan">G&eacute;rard GUILLOU</a> Lien vers le courreir électronique de Gérard Guillou, avec comme objet : "Formation HTML - Glénan"
</font></b></i> leur enseignant.</p> fin de : police courrier, gras et italique
<hr noshade> ligne de séparation de couleur unie

Votre avis nous intèresse(haut)

<h2><font face="Verdana, Arial, Helvetica, sans-serif">Votre avis nous int&eacute;r&eacute;sse</font></h2> Titre niveau 2
<p>Rien n'est obligatoire dans le formulaire ci-dessous !<br>
</p>
paragraphe avec saut de ligne forcé
<hr> ligne séparatrice
<form action="mailto:philippe@leost.fr" method="post" enctype="text/plain"> Définition du formulaire, envoyé par courreir électronique avec un type text/plain pour le corps du message. Pour plus de détails sur les formulaire voir le support de cours sur les formulaires
<p>Pr&eacute;nom : paragraphe
<input type="text" name="prenom"> zone de saise de type texte ayant pour nom prenom
(l'adresse de mail sera envoy&eacute;e avec le formulaire)<br>
texte

Vous &ecirc;tes :
<input type="radio" name="sexe" value="Homme">
Un homme
<input type="radio" name="sexe" value="Femme">
Une femme
<input type="radio" name="sexe" value="Autre">
Ne sait pas <br>

3 boutons radio pour connaitre le "sexe" de l'internaute (pas de bouton par défaut)
Je connais :
<input type="checkbox" name="ouessant" value="oui">
Ouessant
<input type="checkbox" name="sein" value="oui">
Sein
<input type="checkbox" name="glenan" value="oui">
Les Gl&eacute;nan
<input type="checkbox" name="belle-ile" value="oui">
Belle-&icirc;le (<i>plusieurs choix possible</i>)<br>
Je pr&eacute;f&eacute;re :
4 case à cocher. Chacune ayant un nom significatif et une valeur à oui quand la valeur sera transmise.
Aucune case cochée par défaut.
<select name="je_prefere">
<option value="Ouessant">Ouessant</option>
<option value="Sein">Sein</option>
<option value="Glenan">Les Gl&eacute;nan</option>
<option value="Belle-ile">Belle-&icirc;le</option>
</select>
Liste déroulante avec 1 seul choix possible sur 4.
(<i>1 seul choix possible</i>) <br>
texte explicatif en italique avec saut de ligne forcée
J'ai d&eacute;j&agrave; &eacute;t&eacute; sur :
<select name="select" size="2" multiple>
<option value="Ouessant">Ouessant</option>
<option value="Sein">Sein</option>
<option value="Glenan" selected>Les Gl&eacute;nan</option>
<option value="Belle-ile">Belle-&icirc;le</option>
</select>
menu de 2 cases de hauteur avec selcetion multiple possible et les glénan déjà sélectionné
(<i>plusieurs choix possible avec la touche Ctrl et Gl&eacute;nan d&eacute;j&agrave;
s&eacute;lectionn&eacute;</i>) <br>
Vos commentaires sur les &icirc;les...
Texte explicatif
<textarea name="textfield" cols="60" rows="5">C'est ici qu'il faut taper ???</textarea> Zone de texte de 5 lignes de 60 caractères avec une texte déjà saisie
</p>
<p>
fin et début de paragraphe
<input type="submit" name="Envoyer" value="Envoyer le questionnaire"> Bouton validation du formulaire
<input type="reset" name="Effacer" value="Effacer le questionnaire"> Bouton RAZ du formulaire
</p> fin de paragraphe
</form> fin de formulaire
<hr> ligne séparatrice
<p>&nbsp;</p> ligne "vide" avec une espace insécable
</body> fin du corps de la page
</html> fin de la page

(haut)

 

 


© 2004 Léost Informatique - Fouesnant les Glénan (contact@glenan.fr)
Chercher version