CSS-i keele põhitöö

Oleme juba läbi võtnud HTML-i keele põhisildid ja nüüd on aeg teha ilus. Sooviksime omada võimalust muuta teksti värvi, selle suurust, tausta ja palju muud. See tehakse CSS-i keele abil.

Tavaliselt hoitakse CSS-i käske (stiilid) eraldi failis, mis ühendatakse spetsiaalse sildiga kõigi meie veebisaidi HTML-lehtedega.

Selle lähenemise eelis on see, et CSS fail on üks, aga HTML faile võib olla suvaline arv, isegi tuhat. Kui teeme muudatuse ühes kohas CSS-failis, näiteks värvime kõik lõigud punaseks, siis need muudatused rakenduvad kõigil tuhandel HTML- lehtedel, millele meie CSS-fail on ühendatud. Väga mugav ja kiire.

Stiilide faili laiendus peab olema .css. Et ühendada selline fail HTML-lehega, tuleb siltides head kirjutada selline konstruktsioon:

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

Järgmises näites ühendatakse meie HTML-failiga CSS-fail 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>

Looge ja ühendage kõigi oma lehtedega fail styles.css.