< Cascading Style Sheets

CSS

CSS toepassen
  1. Inline CSS
  2. Embedded CSS
  3. Linked CSS
Opmaak
  1. Tekstopmaak
  2. Alineaopmaak
  3. Kleur
  4. Borders
  5. Nieuw in CSS3
Appendices
  1. Properties
  2. Zie ook

Wat is linked CSS?

Bij linked CSS maak je gebruik van een extern stijlblad. Dat betekent dat je CSS code in een apart .css bestand staat en dat je vervolgens in je pagina het stijlblad oproept. Dit is de beste manier om gebruikt te maken van CSS. Hierdoor kunnen meerdere pagina's met exact dezelfde stijlen worden opgemaakt. Je hoeft dan niet een pagina per pagina aanpassen als je de opmaak wilt veranderen. Een extern stijlblad oproepen kan via twee manieren. Het vertrouwde element style of het element link.

Het extern stijlblad

Je moet, om linked CSS te gebruiken, eerst een extern stijlblad aanmaken. Dit kan gewoon via je normale editor. Plaats hierin je CSS code en sla het op met als extensie .css.

HTML-code: Voorbeeld van een extern stijlblad

p {
         text-align: center;
}

Oproepen met style

Een extern stijlblad oproepen met stijl is heel simpel: je gebruikt hiervoor @import daarachter komt de naam van het stijlblad:

HTML-code: Oproepen met style

<style type="text/css">
@import "stijlblad.css";

// je kunt hier achter nog extra CSS code toevoegen
</style>

Het voordeel van style gebruiken is dat je dan nog extra CSS code kunt toevoegen die je alleen maar wilt voor die bepaalde pagina.

Het element link moet je net zoals style in de head plaatsen van de pagina

HTML-code: Oproepen met style

<link rel="stylesheet" type="text/css" href="style.css">

Als je link kent dan ken je ook zijn attributen. Het attribuut rel bepaalt wat de link betekent voor de pagina; in dit geval is dat een stijlblad dus moet stylesheet worden opgegeven. Met type bepaal je welk type bestand het is; hier moet je, net zoals bij style, text/css invullen. En het attribuut href bepaalt waar het bestand te vinden is.

This article is issued from Wikibooks. The text is licensed under Creative Commons - Attribution - Sharealike. Additional terms may apply for the media files.