Practical Group


Quelle que soit la partie HTML considérée, il vous est possible de commenter votre code HTML. Tout texte inclut entre  sera considéré comme étant un commentaire, et ne sera donc pas affiché dans le document. Un commentaire peut servir pour laisser une indication (par exemple) sur votre code HTML, au cas ou vous il vous faudrez y remettre les mains dedans.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 //EN">
Ceci est le premier élément nécessaire pour identifier votre document comme un document HTML compatible.

<HTML>.....< /HTML>
Un document HTML doit débuter par le tag <HTML> et finir par la marque </HTML>. Entre ces deux marques, on trouve essentiellement deux parties. La première est l'en-tête : celle-ci ne contient normalement aucun éléments visuel du document, mais sert plutôt à donner des indications quant-au document en cours d'affichage dans le navigateur WEB. La seconde, le corps, contient le contenu proprement dit de la page. Le corps du document doit suivre l'en-tête (logique, non ?). Voici un petit exemple de définition de document HTML.

<HEAD>.....< /HEAD>
L'en-tête d'un fichier HTML sert à définir diverses choses propres à la page HTML, mais qui n'ont pas forcément d'incidence sur le contenu de la page, comme par exemple le titre apparaissant dans la barre de titre du navigateur WEB. On définit un en-tête de fichier HTML par le couple de tags <HEAD> ... </HEAD>. Voici donc une liste des tags les plus couramment utilisés dans un en-tête de document.

<TITLE>.....< /TITLE>
Ce titre s'introduit dans l'en-tête de votre document par le couple de tags <TITLE> ... </TITLE>. La spécification HTML 4.0 du W3C dit que celui-ci doit être obligatoire et unique (pas de double définition, dont on se demande qu'elle pourrait en être l'utilité). L'exemple ci-dessous montre le squelette d'un document HTML comportant un titre.

<BASE href="http://some.network/file.html">
Specifies the base URL of the document. This is used when dereferencing relative URLs in the page.

<BASE href="http://some.net/file.html" TARGET="...">
Also specifies the base target frame that all links will default to. See the LINK tag for possible values used in TARGET.

<META attribut1 attribute2>
ce tag sert à définir des couples nom-valeur relatifs aux propriétés du document.
Reloade la page automatiquement:

Reloade la page automatiquement :
<META HTTP-EQUIV="REFRESH" CONTENT=X >

Changer de page automatiquement après X secondes :
<META HTTP-EQUIV="REFRESH" CONTENT="X; URL=http://some.address/file.html">

Spécifie une date d'expiration pour une page qui sera relancer après une certaine date :
<META HTTP-EQUIV="Expires" CONTENT="Mon, 23 Sep 1996 01:21:00 GMT">

Spécifier les mots clés identifiés par les engins de recherches:
<META HTTP-EQUIV="Keywords" CONTENT="keyword1, keyword2, ...">

Description de la page:
<META HTTP-EQUIV="Description" CONTENT="Describe your site here....">

<LINK attribute=" HREF="..." >
ce paramètre permet de déterminer la base de résolution des liens du document, qui sont spécifiés.

Attributes:

REL="..."--Specifies the type of relationship of the link to this page. Possible values are: "home", "toc" (table of contents), "index", "glossary", "copyright", "bookmark", "up", "next", "previous", and "help".
REV="..."--Used instead of REL, this specifies a reverse relationship from this page to the link. Possible values are: "made" (author, set HREF=email address) and all the ones used in REL.
HREF="..."--Chemin du lien.
TITLE="..."--Titre du lien.

<BODY attribute1="..." attribute2="...">.....< /BODY>
Contient le corps du document.

Attributes:

ALINK="..."--Specifies the color of the activated links in the page.
BACKGROUND="..."--Specifies an image to be tiled as background.
BGCOLOR="..."--Specifies the background color.
BGPROPERTIES=FIXED--Fixes the background image so that it doesn't scroll. (IE)
LEFTMARGIN="n"--Specifies the left margin for the entire page. (IE)
LINK="..."--Specifies the color of the links in the page.
TEXT="..."--Specifies the color of the text in the page.
TOPMARGIN="n"--Specifies the top margin for the entire page. (IE)
VLINK="..."--Specifies the color of the followed links in the page.

NOTE
: La couleur est toujours exprimée en RGB, pour plus d'informations à ce sujet visiter notre page sur les sélecteur de couleurs.

<BASEFONT attribute=">
Definie la Font pour le document entier.

Attributes:

SIZE="..."--Taille entre 1 et 7 avec 3 par default.
COLOR="..."--Couleur de la Font.
Name="..."--Le nom du type de Font.

<Hn>...< /Hn>
Définie la grosseur d'un titre de 1 à 6, sachant que 1 est le plus petit alors que 6 le plus petit.

<ISINDEX>
Displays a text box indicating the presence of a searchable index. Simply adding this tag will not create a searchable page. The server must be set up to support it.

Attributes:

ACTION="..."--Specifies the location of the gateway program to which the search string should be passed.
PROMPT="..."--Specifies an alternate prompt for the text box.

Multimedia:

<IMG attribute1 attribute2>
Vous pouvez, en HTML, inclure des images dans un document HTML. Deux formats d'images sont acceptés : le format 'JPEG' et le format 'GIF' (y compris ce que l'on nomme le format 'GIF animés'). Pour ce faire, il vous suffit d'utiliser le tag <IMG> : il permet d'introduire une image dans le document. Voici la liste des paramètres que ce tag accepte.

Attributes:

SRC="..."--Ce paramètre permet de référencer l'image qui doit apparaître
DYNSRC="..."--Specifies the URL of a video clip or VRML world. An image can also be specified first using SRC= to cover for browsers that do not support videos. (IE)
CONTROLS--Adds a set of controls under the video clip. (IE)
LOOP="n"--For video clips, specifies the number of times to loop the clip. A value of "-1" or "INFINITE" makes it loop indefinitely. (IE)
START="..."--Specifies when the video clip should start playing. Possible values are "FILEOPEN" (default), "MOUSEOVER", or both. (IE)
USEMAP="#map1" --Ce dernier paramètre est utilisé pour associer à une image, une carte de zones réactives (par défaut, aucune).
ISMAP --Tells the browser that the image is a server-side clickable image map.
ALT="..."--Ce paramètre permet de définir une info-bulle pour l'image considérée. Une info-bulle est un petit texte apparaissant lorsque vous laisser durant un bref instant votre souris immobile sur l'image. Vous pouvez tester cela sur l'image suivante.
BORDER="..."--Ce paramètre permet de fixer la taille de la bordure de l'image. Attention : cette bordure ne s'affiche que si une lien hypertexte est définit sur cette image.
LOWSRC="..."--Ce paramètre permet de spécifier (de même que SRC) la localisation d'une autre image, qui sera chargée avant celle spécifiée par SRC. Cette image doit, bien entendu, être plus petite (en octets) que la précédente (souvent moins détaillée et bicolore), car elle s'affichera en prévision de la suivante. Ainsi, même pour les machines privées de connexion rapide, une ébauche de la page sera disponible assez rapidement. Il doit cependant être clair que si vous utilisez ce paramètre, il faudra attendre plus de temps pour au final avoir l'image principale. En conséquence, et comme les connexions Internet sont de plus en plus rapides, ce paramètre est très peu employé.
ALIGN="..."--Ce paramètre permet de contrôler le positionnement de l'image. Si vous l'affectez avec la valeur "right", l'image sera placée à droite de la fenêtre du navigateur. De même la valeur "left" la placera à gauche et la valeur "center" centrera votre image.

Values:
RIGHT or LEFT--Aligns the image to the specified side of the page, and all text is wrapped around the image.
TOP, MIDDLE, BOTTOM, TEXTTOP, ABSMIDDLE, BASELINE, and ABSBOTTOM --Specifies the vertical alignment of the image with other items on the same line.

VSPACE="..."--Specifies the space left between the edge of the image and the items above or below it.
HSPACE="..."--Specifies the space left between the edge of the image and the items to the left or right of it.
WIDTH="..."--Permet de forcer la largeur de l'image. Si l'image est trop large ou trop étroite, elle sera redimensionnée. Vous remarquerez qu'en l'absence du paramètre fixant la hauteur de l'image, cette dernière est redimensionnée de façon à conserver sa proportionnalité.
HEIGHT="..."--de même, ce paramètre fixe la hauteur de l'image (si aucune information est apportée sur la largeur de celle-ci, le redimensionnement sera proportionnel).

<MAP attribute>...< /MAP>
Ce couple de tags est donc utilisé pour introduire une carte, qui sera utilisée par une image.

Attributes:

NAME="..."--Ce paramètre fixe le nom de la carte. Ce nom sera utilisé pour réaliser l'association entre la carte et l'image.

<AREA attribute1 attribute2>...< /AREA>
Ce tag sert à décrire une des zones de la carte. Voici la liste des paramètres qu'il admet.

Attributes:

SHAPE="..."--Sert à spécifier la nature de la zone décrite. Trois valeurs sont possibles : "rect" (pour un retangle), "circle" (pour un cercle) ou "poly" (pour un polygone).
COORDS="..."--Ce dernier paramètre fixe les coordonnées de la zone décrite. Ces coordonnées doivent être données sous la forme d'une liste d'entiers séparés par des virgules. Dans le cas d'une zone rectangulaire, on spécifie les coordonnées de deux points diamétralement opposés. Dans le cas d'une sphère, on donne son centre et un point de la circonférence. Enfin, pour un polygone, on énumère les coordonnées de tous les sommets, deux à deux consécutifs. Il doit bien être clair que l'utilisation d'un générateur de code HTML vous simplifiera grandement la vie pour ce qui est de la saisie des coordonnées (imaginez les départements de la carte de France).
HREF="..."--Ce paramètre détermine l'URL appelée lorsque l'utilisateur cliquera sur la zone que vous être en train de décrite.
NOHREF--Indicates that this hot spot points to nothing.
TARGET="..."--Défine dans quelle fenêtre le document en lien va s'ouvrire.

Values:
"_blank"--Ouvre dans une nouvelle fenêtre.
"_parent"--Ouvre dans la fenêtre qui est le parent immédiat de la fenêtre.
"_self"--Ouvre dans la fenêtre elle-même.
"_top"--Ouvre dans la fenetre courante.

<BGSOUND attribute1 attribute2> (IE)
Specifie un son en fond (.wav or .au) or midi (.mid) document.

Attributes:

SRC="..."--Specifie le chemin du fichier son.
LOOP="n"--Specifie le nombre de boucle que doit faire le son.

<MARQUEE attribute1 attribute2>...< /MARQUEE> (IE)
Places a scrolling text marquee into the document.

Attributes:

ALIGN="..."-- Possible values of "TOP", "MIDDLE", or "BOTTOM". Specifies the alignment of the text around the marquee with respect to the marquee.
BEHAVIOR="..."--Possible values of "SCROLL" (default), "SLIDE", or "ALTERNATE". Specifies the behavior of the marquee text. "SCROLL" is the default, "SLIDE" makes the text start from off the screen and then stick, "ALTERNATE" makes the text alternate back and forth repeatedly.
BGCOLOR="..."--Specifies the background color of the marquee.
DIRECTION="..."--Possible values are "LEFT" (default) or "RIGHT". Specifies the direction for the text to scroll.
HEIGHT="..."--Specifies the height of the marquee in number of pixels or % of screen.
HSPACE="n"--Specifies the left and right margins of the outside of the marquee in pixels.
LOOP="n"--Specifies the number of times the marquee will loop. Values of "-1" or "INFINITE" make the marquee loop indefinitely.
SCROLLAMOUNT="n"--Specifies the number of pixels between each successive draw of the marquee text.
SCROLLDELAY="n"--Specifies the number of milliseconds between each successive draw of the marquee text.
VSPACE="n"--Specifies the top and bottom margin for the outside of the marquee.
WIDTH="..."--Specifies the width of the marquee either in pixel or in a percentage of the screen.

<APPLET attribute1 attribute2> parameter1 parameter2 ... < /APPLET>
Insert un applet Java dans le document HTML. Tout le texte écrit dans ces tags sera visible par les browsers
ne supportant pas les JAVA applet.

Attributes:

ALIGN="..."-- Possible values of "LEFT", "RIGHT", "TOP", "MIDDLE", or "BOTTOM". Specifies the alignment of the text around the object with respect to the object.
ALT="..."--Specifies the text to be displayed by browsers that recognize the tag but cannot show applets.
CODE="..."--Specifies the name of the Java applet.
CODEBASE="..."--Specifies the base address of the applet. The directory in which the applet is located.
DOWNLOAD=n--Specifies an order in which images are downloaded.
HIGHT="..."--Specifies the height of the applet in number of pixels or % of screen.
HSPACE="n"--Specifies the left and right margins of the outside of the applet in pixels.
NAME="..."--Specifies the name of the applet instance, in case there are more than one of the same applet on the page.
VSPACE="n"--Specifies the top and bottom margin for the outside of the applet.
WIDTH="..."--Specifies the width of the applet either in pixel or in a percentage of the screen.
Parameters:
These are the applet-specific parameters that are passed as arguments to the program. They are specified as tags within the APPLET tag as follows:
<PARAM NAME="..." VALUE="..." >

<EMBED attribute1 attribute2>< /EMBED>
Inserts an embedded multimedia object, such as a sound file or video, into the page. In the future, when the OBJECT tag becomes finalized and well supported, this tag will be obsolete.

Attributes:

AUTOSTART="..."--Specifies whether the file starts playing right away or not. Possible values are "TRUE" or "FALSE".
HIGHT="..."--Specifies the height of the display in number of pixels or % of screen.
LOOP="..."--Specifies whether the file repeats or not. Possible values are "TRUE" or "FALSE".
NAME="..."--Specifies the name of the object, in case there are other objects that refer to this one.
SRC="..."--Specifies the location of the object file.
WIDTH="..."--Specifies the width of the display either in pixel or in a percentage of the screen.

<SCRIPT attribute> ...script statements... < /SCRIPT>
Encloses scripting language statements to be executed by the browser. To ensure backward compatibility, enclose the script statements in comment tags ()

Attributes:

LANGUAGE="..."--Specifies which language is being used in the script such as "VBScript" or "JavaScript".
SRC="..."--Specifies the location of a file containing the script. This can be used if you don't want the code to be on the same HTML file.

<NOSCRIPT> ... < /NOSCRIPT>
Encloses anything you want displayed by browsers that do not support inline scripts. These go inside the SCRIPT tags.

Links:

<A attribute="...">...< /A>
Pour définir un lien hypertexte, il suffit de rajouter au tag <A> le paramètre HREF qui reçoit comme valeur une URL. Lorsque le lecteur activera le lien, il sera redirigé vers l'URL désirée.

Attributes:

HREF="..."--Ce paramètre détermine l'URL appelée lorsque l'utilisateur cliquera sur la zone que vous être en train de décrite.
NAME="..."--Specifie le nom de l'encre que vous avez crée.
onClick="--Specifies a script to be activated when the mouse is clicked.
onMouseOver="--Specifie le script que vous avez associé à cet événement.
REL="..."--Specifies a relative relationship.
REV="..."--Specifies the reverse relationship.
TARGET="..."--Défine dans quelle fenêtre le document en lien va s'ouvrire.

Values:
"_blank"--Ouvre dans une nouvelle fenêtre.
"_parent"--Ouvre dans la fenêtre qui est le parent immédiat de la fenêtre.
"_self"--Ouvre dans la fenêtre elle-même.
"_top"--Ouvre dans la fenetre courante.

TITLE="..."--Specifies the title that appears when the link is selected, but not yet clicked.

Lists:

<LI attribute>
Sert à définir un élément d'une liste.

Attributes:

TYPE="..."--Specifies the type of bullet used to label the item. Possible values are: DISC, CIRCLE, SQUARE, A, a, I, i, 1.
VALUE="..."--Nombre assigné.

<DIR>...< /DIR>
Puts the enclosed items marked with <LI>, in a directory listing.

<MENU>...< /MENU>
Puts the enclosed items marked with <LI>, in a menu list.

<OL attribute>...< /OL>
Celui-ci permet de créer une liste énumérée.

Attributes:

TYPE="..."--Specifies the type of numbering used to label the item. Possible values are: A, a, I, i, 1.
START="..."--Specifies the starting value for the numbering.

<UL attribute>...< /UL>
Puts the enclosed items marked with <LI>, in a bulleted list.

Attributes:

TYPE="..."--Specifies the type of bullet used to label the item. Possible values are: DISC, CIRCLE, SQUARE.

<DL>...< /DL>
Creates a definition list. Within this container, <DT> specifies a definition term and <DD> specifies the definition.

Frames:

<FRAMESET attribute1="..." attribute2="...">...< /FRAMESET>
Defines a set of frames that will make up the page. The FRAME, and NOFRAMES tags go inside this. The FRAMESET tag is used instead of the BODY tag. You can, however, include a BODY tag inside the NOFRAMES tags for browsers that do not support frames.

Attributes:

BORDER="..."--Specifies the width (in pixels) of the border drawn around the frames. (Netscape)
COLS="..."--Creates the frames as columns and specifies the width of each column. Width of the columns can be set using percentages (%), pixels, or relative size (*). For example, if you want your frames to be 3 equally sized columns, you would use: COLS=33%,33%,*
FRAMEBORDER="..."--Specifies whether or not a 3-D border is displayed around the frames. possible values are 0 (no border) or 1(default) (IE)
FRAMESPACING="..."--Specifies in pixels, the amount of space between the frames.
ROWS="..."--Creates the frames as rows and specifies the width of each row. width of the rows can be set using percentages (%), pixels, or relative size (*). For example, if you want a small frame at the top of your page and one large frame below that, you might use: ROWS=15%,*
SCROLLING="..."--Determines whether or not scroll bars are displayed on all the frames. Possible values are "yes", "no", and "auto".

<FRAME attribute1="..." attribute2="...">
Defines a single frame within a frameset.

Attributes:

BORDER="..."--Specifies the width (in pixels) of the border drawn around the frame. (Netscape)
FRAMEBORDER="..."--Specifies whether or not a 3-D border is displayed around the frame. possible values are 0 (no border) or 1(default) (IE)
MARGINHEIGHT="..."--Specifies the top and bottom margins of the frame in pixels.
MARGINWIDTH="..."--Specifies the right and left margins of the frame in pixels.
NAME="..."--Defines a target name for the frame.
NORESIZE--Prevents the frame from being resized by the user
SCROLLING="..."--Determines whether or not scroll bars are displayed along the frame. Possible values are "yes", "no", and "auto".
SRC="..."--Specifies the source file for the frame.

<IFRAME attribute1="..." attribute2="...">< /IFRAME> (IE)
Defines a floating frame. Does not need to be placed within a FRAMESET.

Attributes:

ALIGN="..."--Specifies the alignment of the floating frame and surrounding text. Possible values are TOP, MIDDLE, BOTTOM, LEFT, and RIGHT.
FRAMEBORDER="..."--Specifies whether or not a 3-D border is displayed around the frame. possible values are 0 (no border) or 1 (default)
HEIGHT="..."--Specifies the height of the floating frame.
MARGINHEIGHT="..."--Specifies the top and bottom margins of the floating frame in pixels.
MARGINWIDTH="..."--Specifies the right and left margins of the floating frame in pixels.
NAME="..."--Defines a target name for the floating frame.
NORESIZE--Prevents the frame from being resized by the user
SCROLLING="..."--Determines whether or not scroll bars are displayed along the frame. Possible values are "yes" and "no".
SRC="..."--Specifies the source file for the floating frame.
WIDTH="..."--Specifies the width of the floating frame.

<NOFRAMES>...< /NOFRAMES>
Placed inside the FRAMESET, anything between the beginning and ending of this tag is viewable only by browsers that do not support frames. This tag is used to create pages that are compatible with older browsers that do not support frames.

Tables:

<TABLE attribute1="..." attribute2="...">...< /TABLE>
Creates a table that can include any number of rows.

Attributes:

BORDER="..."--Specifies the width of the border around the table. If set to 0, there will be no border.
BACKGROUND="..."--Specifies the address of an image to be tiled a background. (IE)
BICOLOR="..."--Specifies the background color of the table.
BORDER COLOR="..."--Specifies the border color of the table.
BORDERCOLORLIGHT="..."--Specifies the lighter color used in creating the 3D borders independently. (IE)
BORDERCOLORDARK="..."--Specifies the darker color used in creating the 3D borders independently. (IE)
WIDTH="..."--Specifies the width of the table on the page.
CELLSPACING="..."--Specifies the amount of space between the cells in the table.
CELLPADDING="..."--Specifies the amount of space between the edges of the cell and the text inside.
FRAME="..."--Specifies which sides of the outer border of the table are displayed. (IE)

Possible types:

VOID--No outside borders are displayed.
ABOVE--Displays a border on the top side of the table.
BELOW--Displays a border on the bottom side of the table.
HSIDES--Displays the top and bottom borders of the table.
LHS--Displays the left-hand side border.
RHS--Displays the right-hand side border.
VSIDES--Displays the right and left side borders.
BOX--Displays a border on all sides of the table.
BORDER--Displays a border on all sides of the table.

HEIGHT="..."--Specifies the height of the table on the page.
RULES="..."--Specifies which inner borders of the table are displayed. (IE)

Possible types:

NONE--No inside borders are displayed.
GROUPS--Displays inner borders between the various table groups such as THEAD, TFOOT, TBODY, and COLGROUP groups.
ROWS--Displays inner borders between the table rows.
COLS--Displays inner borders between the table columns.
ALL--Displays inner borders between all rows and columns.

<CAPTION attribute1="...">...< /CAPTION>
Specifies the caption of the table.

Attributes:

ALIGN="..."--Specifies the position of the caption. Possible values are LEFT, RIGHT, BOTTOM, or TOP.

<TR attribute1="..." attribute2="...">...< /TR>
Specifies a table row. It can enclose the table heading and table data.

Attributes:

ALIGN="..."--Specifies the horizontal alignment of the row contents. Possible values are LEFT, RIGHT, and CENTER.
BGCOLOR="..."--Specifies the background color for the row.
BORDERCOLOR="..."--Specifies the border color of the row.
BORDERCOLORLIGHT="..."--Specifies the lighter color used in creating the 3D bordersm independently. (IE)
BORDERCOLORDARK="..."--Specifies the darker color used in creating the 3D borders independently. (IE)
VALIGN="..."--Specifies the vertical alignment of the row contents. Possible values are TOP, MIDDLE, BOTTOM, and BASELINE.
HEIGHT="..."--Specifies the height of the cell.

<TH attribute1="..." attribute2="...">...< /TH>
Makes the cell a table heading.

Attributes:

ALIGN="..."--Specifies the horizontal alignment of the cell contents. Possible values are LEFT, RIGHT, and CENTER.
NOWRAP--Prevents word wrapping within the cell
BGCOLOR="..."--Specifies the background color for the cell.
BACKGROUND="..."--Specifies the address of an image to be tiled as background. (IE)
BORDERCOLOR="..."--Specifies the border color of the cell.
BORDERCOLORLIGHT="..."--Specifies the lighter color used in creating the 3D borders independently. (IE)
BORDERCOLORDARK="..."--Specifies the darker color used in creating the 3D borders independently. (IE)
VALIGN="..."--Specifies the vertical alignment of the cell contents. Possible values are TOP, MIDDLE, BOTTOM, and BASELINE.
ROWSPAN="..."--Specifies the number of rows the cell will span.
COLSPAN="..."--Specifies the number of columns the cell will span.
WIDTH="..."--Specifies the width of the cell.
HEIGHT="..."--Specifies the height of the cell.

<TD attribute1="..." attribute2="...">
These go inside the TR tags and they define the data in a cell. End tag may be used.

Attributes:

BACKGROUND="..."--Specifies the address of an image to be tiled as background. (IE)
BGCOLOR="..."--Specifies the background color for the individual cell.
BORDERCOLOR="..."--Specifies the border color of the cell.
BORDERCOLORLIGHT="..."--Specifies the lighter color used in creating the 3D borders independently. (IE)
BORDERCOLORDARK="..."--Specifies the darker color used in creating the 3D borders independently. (IE)
ALIGN="..."--Specifies the horizontal alignment of the cell contents. Possible values are LEFT, RIGHT, and CENTER.
NOWRAP--Prevents word wrapping within the cell
VALIGN="..."--Specifies the vertical alignment of the cell contents. Possible values are TOP, MIDDLE, BOTTOM, and BASELINE.
ROWSPAN="..."--Specifies the number of rows the cell will span.
COLSPAN="..."--Specifies the number of columns the cell will span.
WIDTH="..."--Specifies the width of the cell.
HEIGHT="..."--Specifies the height of the cell.

<COLGROUP attribute1="..." attribute2="...">(IE)
Specifies the properties of one or more columns. This tag generally goes right after the opening TABLE tag.

Attributes:

ALIGN="..."--Specifies the position of the text within the cells of the Columns. Possible values are CENTER, LEFT, RIGHT, BOTTOM, or TOP.
SPAN="..."--Specifies the number of columns for which these attributes will apply.

<COL attribute1="..." attribute2="..."> (IE)
Used with the COLGROUP tag, this specifies the properties of one column. This tag overrides any attributes specified in the COLGROUP tag that comes right before it.

Attributes:

ALIGN="..."--Specifies the position of the text within the cells of the Column. Possible values are CENTER, LEFT, RIGHT, BOTTOM, or TOP.
SPAN="..."--Specifies the number of columns for which these attributes will apply.

<TBODY>...< /TBODY> (IE)
Encloses the body of your table. This tag is optional unless you are using the THEAD or TFOOT tags. It used to separate the rows in the table from those in the header or footer.

<TFOOT>...< /TFOOT> (IE)
Encloses the table rows that are to be used as a footer. It is an optional tag and comes right after the ending TBODY element.

<THEAD>...< /THEAD> (IE)
Encloses the table rows that are to be used as a header. It is an optional tag and comes before the opening TBODY element.

Forms:

<FORM attribute1="..." attribute2="...">.....< /FORM>
Specifies a form. Forms can be used to send user input to the server in the form of NAME/VALUE pairs.

Attributes:

ACTION="..."--Specifies the address to be used in carrying out the action of the form. Usually the address of the CGI file. You can also specify a mailto address to have the contents of the form emailed to you instead of getting passed to the server. (in future browsers)
METHOD="..."--Specifies the method used by the server in sending the form information. Possible values are POST or GET. When GET is used, the server simply appends the arguments to the end of the action address. With POST, the information is sent as an HTTP post transaction.
TARGET="..."--Specifies which window the result of the form will be loaded into. The target can be a name of a frame that you specified in the FRAME tag or one of the following:

Values:
"_blank"--Loads the result into a new blank window.
"_parent"--Loads the result into the immediate parent of the document the form is in.
"_self"--Loads the result into the same window. (default)
"_top"--Loads the result into the full body of the current window.

ENCTYPE="..."--For future browser. Specifies the type of encoding to use on the form information.

<INPUT attribute1="..." attribute2="...">
Specifies a control or input area for a form, from which a NAME/VALUE pair will be returned to the server.

Attributes:

ALIGN="..."--If the TYPE is IMAGE, then this specifies the alignment of the surrounding text with the image. Possible values are TOP, MIDDLE, BOTTOM, LEFT, or RIGHT.
CHECKED--Use this attribute in a RADIO or CHECKBOX type, and it will be pre-selected when the form loads.
MAXLENGTH="..."--Specifies the maximum number of characters that can be entered in a text input.
NAME="..."--Specifies the name of the control or input area. (Part of the NAME/VALUE pair)
SIZE="..."--Specifies the size of the text entry area that is displayed by the browser.
SRC="..."--If the TYPE is IMAGE, then this specifies the address of the image to be used.
VALUE="..."--Specifies the value to be submitted along with the corresponding name (Part of the NAME/VALUE pair). Specifies the default text string for TEXT. For RESET and SUBMIT, this specifies the text string to be displayed on the 3-D button.
TYPE="..."--Specifies the type of control being used.

Possible types:
CHECKBOX--Creates a checkbox. If the user checks it, the corresponding name/value pair is sent to the server.
HIDDEN--Nothing is displayed by the browser, but the information is still sent to the server.
IMAGE--Like the SUBMIT type, you can have the form sent immediately when the user clicks on an image. Along with the normal information, when a from is submitted by clicking on an image, the coordinates of the clicked point (measured in pixels from the upper-left corner of the image) are also sent. The x-coordinate is submitted with a ".x" appended to the name and the y-coordinate has a ".y" appended to the name.
PASSWORD--Creates a single line entry text box just like the TEXT type, however, user input is not echoed on the screen.
RADIO--Creates a radio list of alternatives of which only one can be selected. Each alternative must have the same name, but different values can be assigned to each.
RESET--Creates a 3-D button that clears the entire form to original values when clicked. You can give the button a name by using the VALUE attribute.
SUBMIT--Creates a 3-D button that submits the form when clicked. You can give the button a name by using the VALUE attribute.
TEXT--Creates a single line text entry box. You can specify the size of the text box by using the SIZE attribute.

<SELECT attribute1="..." attribute2="...">< /SELECT>
Creates a drop-down list of items. The list items are defined by the OPTION tags placed inside the opening and closing SELECT tag.

Attributes:

MULTIPLE--Specifies that multiple items may be selected.
NAME="..."--Specifies the name of the list (Part of the NAME/VALUE pair).
SIZE="..."--Specifies how many items should be visible.

<OPTION value="..."> item
Specifies an item in the drop down list. Placed within the opening and closing SELECT tags. Any text following the OPTION tag is what the user will see in the list.

VALUE="..."--Specifies the value to be returned (Part of the NAME/VALUE pair).
SELECTED--This item will already be highlighted when the page loads.

<TEXTAREA attribute1="..." attribute2="...">...< /TEXTAREA>
Creates a multi-lined text entry box. Any text placed in between the tags is used as the default text string that is displayed when the page is loaded.

Attributes:

COLS="..."--Specifies how wide the text box will be.
ROWS="..."--Specifies how high the text box will be.
NAME="..."--Specifies the name of the text box for use by the program that is processing the form.
WRAP="..."--Specifies how text will wrap. Possible values are "HARD", "SOFT", or "NONE".

Style Sheets:

Style Sheets are a new way to easily and effectively customize web pages in ways that were not possible before. You will be able to specify margins, indents, font faces, and other features to gain control over the exact presentation of your document.

Style Sheet, as designed by the World Wide Web Consortium, are new to HTML and so far only supported be Microsoft's Internet Explorer 3.0. However, Netscape and other browsers will definitely support these new elements in future releases so it is a good idea to get started on using Style Sheets now.

There are three ways to add style to your documents: Linking to a style sheet, Adding a style block, or using inline style attributes. In fact, you can use all three if you like. If there is a conflict, the browser will use the most recent style definitions for that occurrence.

Linking to a Style Sheet
You can create a separate text file with a .css file extension and place all your style definitions (explained below) in that file. Then, using the LINK tag, you can link the style definitions to your current document.
Using this method, you can have one style sheet for the entire site that is linked to each page. That way you can alter the look of all your documents be simply editing the .css file. See syntax below.

Inside the HEAD tag, add something like this:
<LINK REL=STYLESHEET HREF="URL of style sheet" TYPE="text/css" >

Your Style Sheet might contain something like this:
H1 {font-size: 20pt; font-weight: bold}
H2 {font-size: 16pt; font-weight: bold}
P {margin-left: -20px; margin-right: -20px; margin-top: 30px}
BODY {background: URL(http://my.server.com/pictures/back.gif); text-indent: 2cm}

Adding a Style Block
To set the style for an entire page, you can place all the style definitions (explained below) inside the <STYLE>.....< /STYLE> tag. This tag goes inside the HEAD of your document. Make sure to enclose the definitions within comment tags so that older browsers do not display them. See example below.

<HEAD>
.
.
<STYLE TYPE="text/css" >

< /STYLE>
< /HEAD>

Inline Style Attributes
If you simply want to change the style of a particular section of your document, you can do so with the STYLE attribute. You can place this new attribute inside just about any HTML tag, and the style definitions will be in effect until the closing of that tag. Below are some examples.

To change the color and indent of a certain paragraph, you could do the following:
<P STYLE="margin-left: 1in; margin-right: 1in; color: #0000FF">
This text would be indented and blue.
< /P>

To change the style for an entire portion of your document, you might do the following:
<DIV STYLE="margin-left: 0.5in; margin-right: 0.5in; font-family: Arial">
This whole division of the page will be indented and any text will be displayed in the Arial font.
< /DIV>

Style Definitions
All three methods of adding style to a document use the same syntax for style definitions. Except for inline attributes, a style definition consists of a tag followed by a list of specifications enclosed in curly braces. You can define styles for any tag in HTML. Once you have specified styles for a certain tag, every time the tag is used, the styling will be in effect. Below is a list of all the style definitions and their possible values.

background -- Specifies a background color or image.

Values: URL|RGB triplet
Example: BODY {background: #FFFFFF}
color -- Specifies the color of the text.

Values: RGB triplet
Example: H4 {color: #000000}
font-family -- Specifies the typeface.

Values: typeface name or list of names
Example: P {font-family: Arial, Helvetica, "Courier New"}
font-size -- Specifies the size of the text.

Values: pt (points)|in (inches)|cm (centimeters)|px (pixels)|% (percentage)
Example: A:visited {font-size: 14pt}
font-style -- Specifies the style of the text.

Values: italic|normal|oblique|small caps
Example: H3 {font-style: italic}
font-weight -- Specifies the thickness of the text.

Values: extra-light|light|demi-light|medium|demi-bold|extra-bold
Example: H2 {font-weight: bold}
line-height -- Specifies the distance between lines.

Values: pt (points)|in (inches)|cm (centimeters)|px (pixels)|% (percentage)
Example: DIV {line-height: 20pt}
margin-left -- Specifies the left margin.

Values: pt (points)|in (inches)|cm (centimeters)|px (pixels)
Example: BODY {margin-left: 3cm}
margin-right -- Specifies the right margin.

Values: pt (points)|in (inches)|cm (centimeters)|px (pixels)
Example: BODY {margin-right: -0.5in}
margin-top -- Specifies the top margin.

Values: pt (points)|in (inches)|cm (centimeters)|px (pixels)
Example: BODY {margin-top: 20px}
text-align -- Specifies the justification of the text.

Values: left|center|right
Example: H1 {text-align: center}
text-decoration -- Specifies certain text effects.

Values: none|italic|underline|line-through|overline|blink
Example: A:link {text-decoration: none}
text-indent -- Specifies the text indentation.

Values: pt (points)|in (inches)|cm (centimeters)|px (pixels)
Example: P {text-indent: 0.5in}

Additional Options

Grouping
Certain style definitions can be grouped together in one statement. Instead of using three statements to specify all three margins, you could use the following:
P {margin: 20px 3cm 3cm}
The order is top, right, and left.

You can also group all the font statements together like this:

A: active {font: bold italic 15pt/22pt Arial, serif}
The weight and style must be specified first, and the first number represents the size, while the second number represents the line height.
Classes
You can also define more than one instance of a tag. For example, say you wanted two H1 headings; one that was red and one that was blue. You could define the two tags like this:
H1.redh {color: #FF0000; font-size: 20pt}
H1.blueh{color: #0000FF; font-size:20pt}
Later you could use them like this:
<H1 CLASS=redh>This will be red< /H1>
<H1 CLASS=blueh>This will be blue< /H1>

General Formatting:

<ADDRESS>.....< /ADDRESS>
Encloses the signature file of the author of the page. Text is displayed in italics.

<B>...< /B>
Boldfaces the enclosed text.

<BIG>...< /BIG>
Makes the enclosed text one size larger.

<BLINK>.....< /BLINK>
Makes the enclosed text blink continually.

<BLOCKQUOTE>.....< /BLOCKQUOTE>
Encloses a long quote. Both the left and right margins are indented.

<BR>
Inserts a line break.

Attributes:

CLEAR="..."--Causes the text to stop flowing around any images.
Possible values are RIGHT, LEFT, or ALL.

<CENTER>.....< /CENTER>
Centers the enclosed elements. This tag will center everything including images, text, tables, forms, etc.

<CITE>.....< /CITE>
Encloses a citation such as the title of a book or paper.

<CODE>.....< /CODE>
Encloses a sample of code. The text is rendered in small font.

<COMMENT>.....< /COMMENT>
Encloses a comment. Text inside the tags is ignored unless it contains HTML code.

<DFN>.....< /DFN>
Encloses a definition. Text inside the tags is formatted to look like a definition.

<DIV ALIGN=">...< /DIV>
Specifies the alignment of the enclosed elements. Can be used to divide a document into sections that are aligned differently. In future browsers, more attributes will probably be supported.

Attributes:

ALIGN="..."--Sets the alignment of the division. Possible values are "center", "right", or "left".

<EM>...< /EM>
Emphasis on the enclosed text (Italics).

<FONT attribute=">...< /FONT>
Sets the font properties for the enclosed text.

Attributes:

SIZE="..."--Sets the size of the font to any number between 1 and 7 with 3 being default. relative sizes also work, e.g. SIZE=+2 .
COLOR="..."--Specifies the color of the font.
FACE="..."--Specifies the face of the font. A list can be defined (separated by commas) and the browser will use the first one available on that computer.

<HR attribute1="..." attribute2="...">
Inserts a horizontal line.

Attributes:

SIZE="..."--Specifies the thickness of the line.
COLOR="..."--Specifies the color of the line. (IE)
WIDTH="..."--Specifies the length of the line as a percentage of the screen. e.g. WIDTH=90% .
ALIGN="..."--Specifies the alignment of the line: RIGHT, LEFT, or CENTER.
NO SHADE--The line is drawn solid.

<I>...< /I>
The enclosed text is italics.

<KBD>...< /KBD>
Specifies text to be entered at the keyboard. Text is rendered as bold and fixed-width.

<LISTING>.....< /LISTING>
Displays text in fixed-width type. Obsolete -- use the PRE tag instead.

<MULTICOL>.....< /MULTICOL>
Displays text in columns.

Attributes:

COLS="..."--Specifies the number of columns to use.
GUTTER="..."--Specifies the number of pixels between each column.
WIDTH="..."-- Specifies the width of the columns as a whole.

<NOBR>.....< /NOBR>
Causes the enclosed text to not wrap to fit the screen.

<P attribute>...< /P>
Designates the enclosed text as a plain paragraph. The end tag is optional.

Attributes:

ALIGN="..."--Specifies the alignment for the paragraph. Possible values are "center", "left", or "right".

<PLAINTEXT>.....< /PLAINTEXT>
Displays text in fixed-width type without processing most HTML tags. Obsolete -- use the PRE tag instead.

<PRE>.....< /PRE>
Displays text in fixed-width type without collapsing spaces.

<S>.....< /S>
Displays text with a line through it. The <STRIKE> tag does exactly the same.

<SAMP>...< /SAMP>
Indicates sample output from a form or program. Text is rendered in small font.

<SMALL>...< /SMALL>
Makes the enclosed text one size smaller.

<SPACER attribute>...< /SPACER> (Netscape)
Inserts blocks of spaces into HTML documents.

Attributes:

ALIGN="..."--When TYPE=BLOCK, this specifies the alignment of the surrounding text.

Values:
RIGHT or LEFT--Aligns the block of space to the specified side of the page, and all text is wrapped around the block.
TOP, MIDDLE, BOTTOM, TEXTTOP, ABSMIDDLE, BASELINE, and ABSBOTTOM--Specifies the vertical alignment of the block of space with other items on the same line.

HEIGHT="..."--When TYPE=BLOCK, this specifies the height of the block.
SIZE="..."--When TYPE=HORIZONTAL, or VERTICAL, this specifies the size of the space.
TYPE="..."--Specifies the type of space being inserted.

Values:
HORIZONTAL--Inserts blank spaces between words.
VERTICAL--Inserts spaces between two lines.
BLOCK--Inserts a rectangular block of space, much like the IMG tag.

WIDTH="..."--When TYPE=BLOCK, this specifies the width of the block.

<STRONG>...< /STRONG>
Stronger emphasis on the enclosed text (bold).

<SUB>...< /SUB>
Renders the enclosed text in subscript.

<SUP>...< /SUP>
Renders the enclosed text in superscript.

<TT>...< /TT>
The enclosed text is typewriter font.

<U>...< /U>
The enclosed text in underlined. Try to avoid this since underlined text usually indicates a link.

<VAR>...< /VAR>
Specifies a variable. Text is rendered in small fixed-width type.

<WBR>
Causes text enclosed by the NOBR tags to wrap only if necessary.

<XMP>...< /XMP>
Causes enclosed text to be displayed by the browser without processing most HTML tags. Obsolete -- use the PRE tag instead.

page suivante >>>