Jelentése: Cascade Style Sheet

Régen a weboldalak egyszerű kinézettel, néhány sornyi jobbra-balra igazított szöveggel, háttérszínnel és táblázatos szerkesztéssel készültek. Pl. az alábbi képen látható kevésbé jól kinéző oldal.

Ma már a modern weboldalakon egy gomb bárhogy kinézhet, bárhol elhelyezkedhet, képeket rakhatunk egymásra, átméretezhetjük telefonok számára, eltűntethetünk elemeket, vagy akár megjeleníthetünk másokat működés közben, stb. Ezen modern dolgok megjelenítéséhez, működtetéséhez van szükségünk a CSS-re.

A CSS segítségével az oldalainkat szépen kiszínezhetjük, formálhatjuk, rendezhetjük az elemeket ahogy csak szeretnénk, beállíthatjuk, hogy mely elemek látszódjanak az oldalon, melyek ne, melyek jelenjenek meg ha az egérrel föléjük megyünk, stb. . Lassan elmondhatjuk, hogy most már csak a fantáziánk szab határt a weboldalak kinézetének, működésének.

A CSS lényegében nem más, mint egy (általában) külön fájlba írt stílusok sorozata, melyeket írhatjuk általános és egyedi formában is. Az általános formában írt stílusok azt jelentik, hogy nagyon könnyen érvényes lehet sok elemre, mint amikor azt mondjuk, hogy: nő, férfi. Egy társaságban valószínűleg nagyon könnyen ráillik mindenkire.
Az egyedi formában írt stílusok azok melyek egyre jobban körbehatárolják azokat az elemeket amelyekre érvényesek kell legyenek, pl. mikor azt mondjuk, hogy: hosszú hajú nő, borostás férfi. De lehet még egyedibb forma is: szürke szoknyában levő hosszú hajú nő.

Egy elem kiválasztása egy adott környezetből nagyon sokféle képpen történhet: "a" elemek (az összes a elem), div elemen belüli "a" elemek, div elemen belüli h2 elem összes a eleme, stb. Az, hogy hogyan választunk ki egy elemet legtöbbszőr tőlünk függ, a lehetőségek száma elég nagy.

Amennyiben a CSS stílusokat egy különálló fájlba írjuk, azt css kiterjesztéssel látjuk el, bár működne akkor is, ha .txt kiterjesztést adunk neki, de sokkal egyértelműbb számunkra és mások számára is, ha a hagyományos nevet választjuk. pl: style.css

Működése egyszerű: az oldal betöltődésekor a fejlécben (head) betöltődik, majd a böngészőnk minden megírt stílust értelmez és megkeresi a HTML forráskódban a stílusoknak megfelelő elemeket, majd beállítja ezen elemekre az új stílusokat.