36 CSS õigekiri

CSS faili võib nagu HTML dokumendigi luua mistahes tekstiredaktorit kasutades. Nagu HTML dokumendis, või mistahes programmeerimiskeeleski, on kasulik kasutada kommentaariridu. CSS kommentaar kirjutatakse kujul:

/* See on kommentaar */

CSS abil veebilehe elementidele kujunduse kirjutamisel pannakse kirja kolm tähtsat osa: selektor (selector, mis on reeglina tavaline HTML-elemendi nimetus), omadus (property) ja selle väärtus (value). Kõik see pannakse kirja järgmisel kujul:

selector {property: value}

Näiteks:

body {color: black}

NB! CSS failis ei tohi kasutada html-märgendeid! See tähendab, et näiteks ei tohi kirjutada <body>!

Kui väärtus koosneb mitmest sõnast, siis tuleb see jutumärkide vahele paigutada! Näiteks:

p {font-family: "sans serif"}

Mitmete omaduste väärtuste puhul tuleb kirja panna ka mõõtühik. Sellisel juhul ei tohi väärtuse ja selle mõõtühiku vahele tühikut jätta! Näiteks:

p { font-size: 36pt;}

Vahetevahel on kasulik erinevate omaduste väärtustena kasutada konkreetsete väärtuste asemel dünaamiliselt arvutatavaid väärtuseid. CSS3 pakub arvutusteks calc() funktsiooni. Funktsiooni sulgudes pannakse kirja matemaatikaavaldis, mille tulemuseks on soovitud väärtus. Kasutada saab matemaatika põhitehteid (liitmine, lahutamine, korrutamine ja jagamine) ehk operaatoreid +, -, * ja /. Näiteks:

img {
  width: calc(50% - 50px);
}

Korraga võib määrata väärtused ühe HTML elemendi (selektori) mitmele omadusele, selleks tuleb need lihtsalt semikoolonitega eraldada! Näiteks:

p {text-align:center;color:red}

Et stiili kirjeldust kergemini loetavaks muuta, on kasulik iga omadus eraldi reale paigutada! Näiteks:

p { 
  text-align:center; 
  font-family: arial; 
  color:red; 
}

NB! Tüüpilise veana unustatakse mõne omaduse rea lõppu semikoolon ja/või stiili lõppu loogeline sulg lisada. Sellisel juhul stiilileht ei toimi ja kujundus veebilehele ei rakendu!

Litsents

Icon for the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License

Veebidisain by Koostaja: Mikk Oad; Tekst: Andrus Rinde, Mikk Oad is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License, except where otherwise noted.

Jaga seda raamatut