Deel 2

Links:

De vier verschillende stijl-mogelijkheden :

INLINE Style Sheets :

De STYLE (stijl) eigenschap wordt in een HTML tag geplaatst en bepaat een stijl voor de tekst, geplaatst tussen deze tag.
Vb.
<P style="font-size: 10pt; color: fuchsia">Dit is een voorbeeld van een stijl in een tag. </P>
En we krijgen:

Dit is een voorbeeld van een stijl in een tag.

We merken op dat de stijl alleen van toepassing is op de tekst tussen de begin- en eindtag.
Het geheel wordt gevormd door een eigenschap waarvan we eerst de naam zetten, gevolgd door een dubbelpunt, en dan de waarde. De verschillende eigenschappen worden gescheiden door een punt-komma.

External Style Sheets :

Vele HTML programmeurs maken afzonderlijke Style Sheets en verbinden deze dan met HTML pagina's. Dit heeft als voordeel dat men in verschillende pagina's gebruik kan maken van één Style Sheet. Men kan ook de stijl veranderen zonder de HTML pagina te veranderen. Men kan ook verschillende Style Sheets maken, en ze afzonderlijk oproepen.
Vb.

<LINK href="nieuw.css" rel="stylesheet" type="text/css">
Hier wordt de Style Sheet "nieuw.css " opgeroepen en verbonden met de HTML pagina waarin deze LINK wordt gezet. Na de HREF wordt de URL naar de Style Sheet gezet.

Embedded Style Sheets :

Hiermede kunnen we een volledige Style Sheet binnen de STYLE tag, in één HTML document plaatsen. Deze STYLE tags worden genesteld in de HEAD tags.
Vb.
width=<STYLE type="text/css">
<!--
H1 { color: red }
P { color: blue}
-->
</STYLE>
Wanneer we in dit document een H1 tag gebruiken , zal de tekst na die tag in het rood worden gezet. Bij het aanroepen van een P tag zal de tekst in het blauw worden gezet. Dit is van toepassing op alle H1 en P tags in dit HTML document.

Cascading Style Sheets :

Eeen Waarschuwing: Gebruik geen Style Sheets in verschillende "style talen" door elkaar. Zoals bij External Style Sheets zal men de sheets linken met de LINK tag. Specifiek aan de Cascading Style Sheets is dat men verschillende sheets aan één enkel HTML document linkt.
Vb.
<LINK rel="stylesheet" title="11" href="klein.css" type="text/css">
<LINK rel="stylesheet" title="12" href="nieuw.css" type="text/css">
<LINK rel="stylesheet" title="13" href="groot.css" type="text/css">
Een goed voorbeeld is een Intranet binnen een bedrijf waar ieder departement zijn eigen Style Sheet heeft. Men kan deze verschillende Style Sheets importeren. Met een CLASS definitie kan men ieder element van deze Style Sheets oproepen.