AUTOROUTE ÉLECTRONIQUE

Ce deuxième paragraphe devrait être indenté de 2cm de plus que le précédent et représente le style para2 de la page. Dans certains cas c'est plus simple de faire la présentation du texte avec un style plutôt que d'utiliser les listes pour indenter et en plus on peut définir tous les autres éléments du style de texte.

Ce paragraphe, para3, reçoit une indentation de 6cm à gauche et 6cm à droite et est en italique - il pourrait servir pour une citation, par exemple. Notez aussi que la taille du texte est définie à 12 points (12pt) plutôt que 12 pixels (12px) - c'est préferable quand on est habitué à travailler en points - dans ce cas, 12pt semble un peu plus gros que 14px.

Voici maintenant un tableau des propriétés utilisées pour définir les styles:

On peut définir ses propres styles d'entêtes au lieu d'utiliser H1..H6 du HTML

Ceci est un H1 ordinaire de HTML

Pour assigner un style à un élément de texte on utilise le tag <DIV> et on nomme le style avec le paramètre class= comme ceci:

Pour décrire les styles on utilise le tag <STYLE> .... </STYLE> dans la section <HEAD> de la page.

La liste des propriétés est assez longue; vous voyez les principales dans les exemples ci-haut et nous en étudierons plusieurs autres au cours des prochaines leçons. Cependant, si vous utilisez un éditeur HTML vous pouvez toujours consulter la fonction "Aide" du logiciel pour en apprendre davantage.

Il y a 3 façons de définir les styles:

Style en ligne: le style est défini dans l'élément de texte lui-même - ceci n'est pas d'une grande utilité.
Feuille de styles globale: c'est ce qui est décrit içi - les styles sont décrits au début de la page, dans l'entête, et sont utilisés par tous les éléments de la page - c'est la façon la plus commune.
Feuille de styles liée: la feuille de style est stockée dans un fichier séparé qui porte l'extension .css - le lien est décrit au début de la page comme:
<LINK REL="stylesheet" TYPE="text/css" HREF="styles.css">
ceci a l'avantage que les styles qu'on a créé sont disponibles à toutes les pages du site sans avoir à les recréer à chaque page. Le fichier .css ne doit contenir aucun codes HTML (même pas les tags <STYLE> ... </STYLE>) - il ne contient que les commandes de mise en page.

Black	Maroon	Green	Olive
Navy	Purple	Teal	Gray
Silver	Red	Lime	Yellow
Blue	Fuchsia	Aqua	White
Brown	Orange	Magenta	Gold

Style Sheet Definitions Quick Reference
Attribute	Description	Values	Example
font-size	Sets size of text.	points (pt) inches (in) centimeters (cm) pixels (px)	{font-size: 12pt}
font-family	Sets typeface.	typeface name font family name	{font-family: courier}
font-weight	Sets thickness of type.	extra-light light demi-light medium demi-bold bold extra-bold	{font-weight: bold}
font-style	Italicizes text.	normal italic	{font-style: italic}
line-height	Sets the distance between baselines.	points (pt) inches (in) centimeters (cm) pixels (px) percentage (%)	{line-height: 24pt}
color	Sets color of text.	color-name RGB triplet	{color: blue}
text-decoration	Underlines or otherwise highlights text.	none underline italic line-through	{text-decoration: underline}
margin-left	Sets distance from left edge of page.	points (pt) inches (in) centimeters (cm) pixels (px)*	{margin-left: 1in}
margin-right	Sets distance from right edge of page.	points (pt) inches (in) centimeters (cm) pixels (px)*	{margin-right: 1in}
margin-top	Sets distance from top edge of page.	points (pt) inches (in) centimeters (cm) pixels (px)*	{margin-top: -20px}
text-align	Sets justification.	left center right	{text-align: right}
text-indent	Sets distance from left margin.	points (pt) inches (in) centimeters (cm) pixels (px)*	{text-indent: 0.5in}
background	Sets background images or colors.	URL, color-name RGB triplet	{background: #33CC00}