Basis van werken met de CSS-taal

We hebben de basistags van de HTML-taal al behandeld en nu is het tijd om het er mooi uit te laten zien. We zouden graag de kleur van de tekst willen kunnen wijzigen, zijn grootte, de achtergrond en nog veel meer. Dit gebeurt met behulp van de CSS-taal.

Over het algemeen worden CSS-commando's (stijlen) opgeslagen in een apart bestand, dat met een speciale tag wordt verbonden met alle HTML-pagina's van onze website.

Het voordeel van deze aanpak is dat er één CSS-bestand is, terwijl er een willekeurig aantal HTML-bestanden kan zijn, zelfs duizend. Als we een wijziging aanbrengen op één plek in het CSS-bestand, bijvoorbeeld alle alinea's rood maken, dan zullen deze wijzigingen worden toegepast op alle duizend HTML-pagina's waaraan ons CSS-bestand is gekoppeld. Zeer handig en snel.

Het stijlbestand moet de extensie .css hebben. Om zo'n bestand aan een HTML-pagina te koppelen, moet u in de tag head de volgende constructie schrijven:

<link rel="stylesheet" href="fileName.css">

In het volgende voorbeeld wordt ons HTML-bestand gekoppeld aan het CSS-bestand styles.css:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>This is the title</title>
		<link rel="stylesheet" href="styles.css">
	</head>
	<body>
		<p>
			This is a paragraph with text.
		</p>
	</body>
</html>

Maak het bestand styles.css aan en koppel het aan al uw pagina's.