Mi a Cascading Style Sheets?
A weboldalak számos egyedi darabból állnak, beleértve a képeket, szöveget és különböző dokumentumokat. Ezek a dokumentumok nem csak azokat tartalmazzák, amelyek különböző oldalakról, például PDF-fájlokról kapcsolódhatnak, hanem azokhoz a dokumentumokhoz is, amelyeket maguk az oldalak szerkesztésére használnak, például a HTML-dokumentumokat, hogy meghatározzák az oldalak szerkezetét és a CSS (Cascading Style Sheet) dokumentumokat diktálni az oldal megjelenését. Ez a cikk átkeredi a CSS-be, amely magában foglalja, hogy mi az, és hol használják a weboldalakat ma.
A CSS History Lecke
A CSS-t először 1997-ben fejlesztették ki a webfejlesztők számára, hogy meghatározhassák az általuk létrehozott weboldalak vizuális megjelenését. Arra tervezték, hogy a webes szakemberek elválaszthassák a webhely kódjának tartalmát és szerkezetét a vizuális dizájntól, ami eddig még nem volt lehetséges.
A struktúra és a stílus szétválasztása lehetővé teszi a HTML számára, hogy több funkciót töltsön be eredetileg - a tartalom jelölésénél, anélkül, hogy aggódnia kellene az oldal megtervezésétől és elrendezésétől, amit általában a "megjelenés és érzés" az oldalon.
A CSS 2000-ig nem érte el a népszerűséget, amikor a webböngészők többet kezdtek használni a jelölőnyelv alapszintű betűtípusának és színének szempontjából. Ma minden modern böngésző támogatja az összes CSS 1. szintet, a CSS 2. szintjének nagy részét, és még a CSS 3. szint legtöbb aspektusát is. Mivel a CSS tovább fejlődik és új stílusokat vezet be, a webböngészők elkezdték végrehajtani azokat a modulokat, amelyek új CSS-támogatást nyújtanak ezeknek a böngészőknek, és a webes tervezőknek új, stílusos eszközöket kínálnak a munkához.
A (sok) év múlva olyan webes tervezők voltak, akik nem akarták használni a CSS-t a weboldalak tervezéséhez és fejlesztéséhez, de ez a gyakorlat ma már távol van az iparágtól. A CSS ma már széles körben használt szabvány a webes tervezésben, és nehéz lenne megtalálni az iparágban dolgozó embereket, akiknek nem volt legalább egy alapvető ismerete ennek a nyelvnek.
A CSS egy rövidítés
Amint már említettük, a CSS kifejezés a "Cascading Style Sheet" kifejezést jelenti. Tüntessük meg ezt a kifejezést egy kicsit, hogy részletesebben elmagyarázzuk, mit tesznek ezek a dokumentumok.
A "stíluslap" szó magára a dokumentumra utal (mint például a HTML, a CSS fájlok valójában csak szöveges dokumentumok, amelyek változatos programokkal szerkeszthetők). A stíluslapokat évek óta használják a dokumentumtervezéshez. Ezek a nyomtatványok vagy az online elrendezés műszaki leírása. A nyomtatási tervezők régóta használják a stíluslapokat, hogy meggyőződjenek arról, hogy a formatervezési minta pontosan a specifikációihoz készült. A weblap egy stíluslapja ugyanazt a célt szolgálja, de a hozzáadott funkcióval azt is elmondja, hogy a böngésző hogyan jeleníti meg a dokumentumot. A CSS stíluslapok ma is használhatják a médiakérdéseket, így megváltoztathatják, hogy az oldal hogyan keres különböző eszközöket és képernyőméreteket . Ez hihetetlenül fontos, mivel lehetővé teszi, hogy egyetlen HTML-dokumentumot másképp rendezzen el a képernyőhöz való hozzáféréshez.
A Cascade a "lépcsőzetes stíluslap" kifejezetten különleges része. A webes stíluslap célja, hogy a lapon egy sor stílusban kaszkadjon, mint egy folyó vízesés felett. A folyó vizében a vízesés minden szikláját eltalálja, de csak azok, amelyek alul vannak, pontosan befolyásolják a víz áramlását. Ugyanez igaz a kaszkádra a weboldal stíluslapjaiban.
Minden weblapot legalább egy stíluslap érinti, még akkor is, ha a webdesigner nem alkalmaz stílusokat. Ez a stíluslap a felhasználói ügyintéző-stíluslap - amelyet alapértelmezett stílusnak is neveznek, amelyet a webböngésző az oldal megjelenítésére használ, ha más utasításokat nem nyújtanak. Például alapértelmezés szerint a hiperhivatkozások kék színűek, és aláhúzva vannak. Ezek a stílusok a webböngésző alapértelmezett stíluslapjából származnak. Ha a webdesigner más utasításokat ad meg, azonban a böngészőnek tudnia kell, mely utasításoknak van elsőbbsége. Minden böngészőnek saját alapértelmezett stílusai vannak, de ezek közül az alapértelmezések közül sok (például a kék aláhúzott szöveges linkek) megoszlanak az összes vagy a legtöbb nagy böngészőben és verzióban.
A böngésző alapértelmezés szerinti másik példájához a böngészőmben az alapértelmezett betűtípus a " Times New Roman ", amely a 16-os méretben jelenik meg. Azonban a megjelenő oldalak szinte egyetlen oldalán sem jelenik meg a betűcsaládban és -méretben. Ez azért van így, mert a kaszkád meghatározza, hogy a második stíluslapok, amelyeket a tervezők maguk határoztak meg, újradefiniálják a betűméretet és a családot, és felülbírálják a böngésző alapértelmezéseit. A weboldalra létrehozott stíluslapok jobban fogalmazódnak meg, mint a böngésző alapértelmezett stílusai, ezért ezek az alapértelmezések csak akkor érvényesek, ha a stíluslap nem felülírja őket. Ha a hivatkozásokat kékre és aláhúzottra szeretné állítani, akkor nem kell semmit tennie, mivel ez az alapértelmezett, de ha webhelyének CSS-fájlja azt mondja, hogy a hivatkozásoknak zöldnek kell lenniük, akkor a szín felül fogja hagyni az alapértelmezett kék színt. A hangsúly ebben a példában marad, mivel másképpen nem határozta meg.
Hol van a CSS?
A CSS segítségével meg lehet határozni, hogyan kell a weboldalaknak más médiában megtekinteni, mint egy webböngészőt. Például létrehozhat egy nyomtatási stíluslapot, amely meghatározza, hogy a weblap hogyan nyomtatható ki. Mivel a weboldal elemei, mint pl. A navigációs gombok vagy a webes űrlapok nincsenek a nyomtatott oldalon, a nyomtatási stílus lapot használhatja arra, hogy "kikapcsolja" azokat a területeket, amikor egy oldalt kinyomtat. Bár sok helyszínen nem igazán gyakori gyakorlat, a nyomtatási stíluslapok létrehozásának lehetősége erőteljes és vonzó (tapasztalatom szerint a legtöbb internetes szakember nem ezt teszi egyszerűen azért, mert a webhely költségvetése nem igényli ezt a további munkát ).
Miért fontos a CSS?
A CSS az egyik leghatékonyabb eszköz, amelyet a webes tervezõ megtanulhat, mert ezzel befolyásolhatja a webhely teljes vizuális megjelenését. A jól írt stíluslapok gyorsan frissíthetők, és lehetővé teszik a webhelyek számára, hogy megváltoztassák a képernyőn megjelenő fontossági sorrendet, ami viszont értéket és figyelmet fordít a látogatókra anélkül, hogy változtatásokra lenne szükség az alapul szolgáló HTML jelöléshez.
A CSS legfőbb kihívása az, hogy nagyon kevés tanulni - és a böngészők napról napra változik, ami ma jól működik, holnap nem lesz értelme, mert az új stílusok támogatottak lesznek, mások pedig okkal vagy másként .
Mivel a CSS képes kaszkálni és kombinálni, és figyelembe véve, hogy a különböző böngészők hogyan értelmezhetik és hajthassák végre az irányelveket eltérő módon, a CSS nehezebb lehet, mint a sima HTML. A CSS is változik a böngészőkben oly módon, hogy a HTML valóban nem. Miután elkezdted használni a CSS-t, látni fogod, hogy a stíluslapok hatalmának kihasználása hihetetlen rugalmasságot nyújt a weblapok elrendezésének és a megjelenés és megjelenés meghatározásának. Útközben olyan stílusok és megközelítések "táska trükkök" fognak összegyűjteni, amelyek a múltban dolgoztak neked, és amelyekre a jövőben új weboldalakat építhetsz be.
Jennifer Krynin eredeti cikke. Szerkesztette Jeremy Girard, 2007.07.05.