SEOpromotiepagina.nl
Home HTML Een CSS Stylesheet gebruiken op je website

Mooie zinnen en leuke teksten voor Hyves, Facebook, Twitter, MSN of website Geld verdienen met website YouTube downloader, download video's van YouTube Kenteken gegevens opvragen motorvoertuig (RDW kentekencheck) SEO Checklist Google AdSense

Een CSS Stylesheet gebruiken op je website
                     Deel dit artikel!
  

Een CSS Stylesheet gebruiken op je websiteTegenwoordig wordt er heel veel met Cascading Style Sheets gewerkt. Meestal wordt de afkorting CSS gebruikt. CSS is een manier om de vormgeving voor webpagina’s in één keer vast te leggen. Dit is vooral handig als je meerdere webpagina’s hebt binnen je website.

Cascading Style Sheets gebruiken

Een Style sheet is een lijst met definities van de opmaak voor een HTML pagina. Normaal definieer je de style in de <head> sectie van je html pagina. Als je maar één webpagina hebt voor je website is dit best te doen. Maar als je website uit meerdere websites bestaat, moet je zodra je in één webpagina de style aanpast, dit in alle andere pagina’s ook doen. Het is dan handiger als je voor je hele website één plaats hebt waar je de opmaak voor de gehele site definieert. Je webpagina’s bevatten dan ook minder code, waardoor je pagina’s sneller in de browser laden.

Een belangrijke reden om cascading style sheets te introduceren is om de vormgeving van webpagina’s meer te standaardiseren. Dit is handig, want als er een standaard is kunnen alle verschillende webbrowsers deze gebruiken om een en dezelfde pagina in alle browsers op dezelfde wijze aan de gebruiker te laten zien. Het Word Wide Web Consortium (W3C) heeft de CSS standaard vastgelegd.

Verwijzen naar een Stylesheet

Je kunt op drie manieren verwijzen naar een stylesheet. Namelijk via een Inline style sheet, een internal styles sheet of een external stylesheet.

Bij een inline style sheet worden de style elementen direct aan de HTML tag van een stuk tekst toegevoegd. Dit komt vrij weinig voor, alleen nog bij echte amateur website makers.

Bij een internal style sheet, ook wel embedded style sheet genoemd wordt de style informatie (opmaak informatie) in de <head> sectie geplaatst.

Bij een external stylesheet, waarover we het in de rest van dit artikel zullen hebben, wordt de style informatie in een apart bestand geplaatst met de extentie .css. In al je HTML webpagina’s maak je een verwijzing in de header naar deze style sheet.

Een voorbeeld van het verwijzen naar een external style sheet:

<html>
<head>
<title>Titel van je webpagina>
<link href="/stylesheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
Hier komt de verdere inhoud van je pagina.
</body>
</html>

Een external Stylesheet maken

Een CSS bestand is vrij makkelijk te maken. Let er op dat je nooit HTML tags in je external style sheet gebruikt, want dan werkt het niet. Je zet in feite dus gewoon de styleregels in het .css bestand. In het voorbeeld van de vorige alinea noemden we het .css bestand stylesheet.css. Uiteraard mag je het bestand ook een andere naam geven, zolang je maar naar het goede .css bestand verwijst.
In de stylesheet zet je dus de opmaak neer zonder html tags. Een voorbeeld van de inhoud van een .css bestand:

body { font-family: arial; background-color: red }
h2 { color: blue; font-style: italic }
p { text-decoration: underline }
 

Je kunt ons sponsoren door dit artikel te delen met je vrienden. Gebruik dan de buttons hierboven!

Plaats reactie

Beveiligingscode
Vernieuwen