Kas yra CSS ir kur jis naudojamas?

Svetaines sudaro keletas atskirų dalių, įskaitant vaizdus, ​​tekstą ir įvairius dokumentus. Šie dokumentai apima ne tik tuos, į kuriuos galima susieti nuorodas iš įvairių puslapių, pvz., PDF failus, bet ir dokumentus, kurie naudojami patiems puslapiams kurti, pvz.HTML dokumentaiPuslapio struktūrai nustatyti ir CSS (Cascading Style Sheet) dokumentų, kad diktuotų puslapio išvaizdą. Šiame straipsnyje bus nagrinėjama CSS, kas tai yra ir kur jis šiandien naudojamas svetainėse.

CSS istorijos pamoka

CSS pirmą kartą buvo sukurtas 1997 m. kaip būdas žiniatinklio kūrėjams apibrėžti savo kuriamų tinklalapių vizualinę išvaizdą. Ji buvo skirta leisti interneto profesionalams atskirti turinį ir svetainės kodo struktūra pagal vizualinį dizainą, o tai nebuvo įmanoma iki šiol.

Struktūros ir stiliaus atskyrimas leidžia HTML atlikti daugiau funkcijų, kuriomis jis iš pradžių buvo pagrįstas – turinio žymėjimą, nesijaudinant dėl ​​paties puslapio dizaino ir išdėstymo, o tai paprastai vadinama „išvaizda ir pojūčiu“. puslapio.

CSS raida

CSS išpopuliarėjo tik maždaug 2000 m., kai žiniatinklio naršyklės pradėjo naudoti daugiau nei pagrindinius šios žymėjimo kalbos šrifto ir spalvų aspektus. Šiandien visos šiuolaikinės naršyklės palaiko visą CSS 1 lygį, didžiąją dalį CSS 2 lygio ir net daugumą CSS lygio 3 aspektų. Kadangi CSS ir toliau tobulėja ir pristatomi nauji stiliai, interneto naršyklės pradėjo diegti modulius, kurie suteikia naują CSS palaikymą. į tas naršykles ir suteikite žiniatinklio dizaineriams naujų galingų stiliaus įrankių.

Per daugelį metų kai kurie interneto dizaineriai atsisakė naudoti CSS interneto svetainių kūrimas ir kūrimas, tačiau šios praktikos pramonėje šiandien visiškai nebėra. CSS dabar yra plačiai naudojamas žiniatinklio dizaino standartas, todėl jums būtų sunku rasti ką nors, kas šiandien dirba pramonėje, kuris neturėtų bent elementarių šios kalbos žinių.

CSS yra santrumpa

Kaip jau minėta, terminas CSS reiškia „pakopinis stiliaus lapas“. Šiek tiek suskaidykime šią frazę, kad išsamiau paaiškintume, ką daro šie dokumentai.

Žodis „stiliaus lapas“ reiškia patį dokumentą (kaip ir HTML, CSS failai iš tikrųjų yra tik tekstiniai dokumentai, kuriuos galima redaguoti įvairiomis programomis). Stiliaus lapai dokumentų projektavimui naudojami daugelį metų. Tai techninės spausdinto ar internetinio maketo specifikacijos. Spaudos dizaineriai jau seniai naudoja stiliaus lapus, kad užtikrintų, jog jų dizainai būtų atspausdinti tiksliai pagal jų specifikacijas. Tinklalapio stiliaus lapas tarnauja tam pačiam tikslui, tačiau su papildoma funkcija, nurodant žiniatinklio naršyklei, kaip pateikti peržiūrimą dokumentą. Šiandien taip pat gali būti naudojami CSS stiliaus lapai žiniasklaidos užklausos pakeisti puslapio ieškomą būdą įvairių įrenginių ir ekrano dydžių . Tai nepaprastai svarbu, nes leidžia vieną HTML dokumentą pateikti skirtingai, atsižvelgiant į ekraną, naudojamą prieigai prie jo.

Kaskados yra tikrai ypatinga termino „kaskadinis stiliaus lapas“ dalis. Interneto stiliaus lapas yra skirta pakopomis per tam tikrus stilius tame lape, kaip upė virš krioklio. Vanduo upėje atsitrenkia į visas krioklio uolas, tačiau tik apačioje esančios uolienos turi įtakos, kur tiksliai tekės vanduo. Tas pats pasakytina ir apie kaskadą svetainių stiliaus lapuose.

Dizainerio stiliaus lapai nepaiso naršyklės numatytųjų stiliaus lapų

Kiekvienam tinklalapiui įtakos turi bent vienas stiliaus lapas, net jei žiniatinklio dizaineris netaiko jokių stilių. Šis stiliaus lapas yra vartotojo agento stiliaus lapas – taip pat žinomas kaip numatytieji stiliai, kuriuos interneto naršyklė naudos puslapiui rodyti, jei nepateikiama kitų instrukcijų. Pavyzdžiui, pagal numatytuosius nustatymus hipersaitai yra mėlynos spalvos ir yra pabraukti. Šie stiliai gaunami iš interneto naršyklės numatytojo stiliaus lapo. Tačiau jei žiniatinklio kūrėjas pateikia kitas instrukcijas, naršyklė turės žinoti, kurios instrukcijos turi pirmenybę. Visos naršyklės turi savo numatytuosius stilius, tačiau daugelis tų numatytųjų (pvz., mėlynai pabrauktos teksto nuorodos) yra bendrinami visose arba daugumoje pagrindinių naršyklių ir versijų.

Kitame numatytosios naršyklės pavyzdyje mūsų žiniatinklio naršyklėje numatytasis šriftas yra „ Times New Roman ' rodomas 16 dydžiu. Tačiau beveik nė vienas mūsų lankomas puslapis nerodomas tos šriftų grupės ir dydžio. Taip yra todėl, kad pakopoje apibrėžiama, kad antrieji stiliaus lapai, kuriuos nustato patys dizaineriai, iš naujo apibrėžia šrifto dydį ir šeima, nepaisydami numatytųjų žiniatinklio naršyklės nustatymų. Visi tinklalapiui sukurti stilių lapai bus konkretesni nei numatytieji naršyklės stiliai, todėl šie numatytieji nustatymai bus taikomi tik tuo atveju, jei stiliaus lapas jų nepaisys. Jei norite, kad nuorodos būtų mėlynos ir pabrauktos, nieko daryti nereikia, nes tai yra numatytoji, bet jei jūsų svetainės CSS faile nurodoma, kad nuorodos turi būti žalios, ši spalva pakeis numatytąją mėlyną. Šiame pavyzdyje pabraukimas išliks, nes nenurodėte kitaip.

Kur naudojamas CSS?

CSS taip pat gali būti naudojamas norint apibrėžti, kaip tinklalapiai turėtų atrodyti žiūrint ne a interneto naršyklė . Pavyzdžiui, galite sukurti spausdinimo stiliaus lapą, kuriame bus nurodyta, kaip turi būti spausdinamas tinklalapis. Kadangi tinklalapio elementai, tokie kaip naršymo mygtukai ar žiniatinklio formos, neturės jokios paskirties spausdintame puslapyje, spausdinimo stiliaus lapas gali būti naudojamas šioms sritims „išjungti“, kai puslapis spausdinamas. Nors daugelyje svetainių tai nėra įprasta praktika, galimybė kurti spausdinimo stiliaus lapus yra galinga ir patraukli (mūsų patirtis rodo, kad dauguma žiniatinklio profesionalų to nedaro vien todėl, kad dėl svetainės biudžeto nereikia atlikti šio papildomo darbo. ).

Kodėl CSS yra svarbus?

CSS yra vienas iš galingiausių įrankių, kuriuos gali išmokti žiniatinklio dizaineris, nes su juo galite paveikti visą svetainės vizualinę išvaizdą. Gerai parašyti stilių lapai gali būti greitai atnaujinami ir leidžia svetainėms vizualiai pakeisti tai, kam ekrane suteikiama pirmenybė, o tai savo ruožtu parodo lankytojų vertę ir dėmesį, nereikalaujant jokių pagrindinių pakeitimų. HTML žymėjimas .

Pagrindinis CSS iššūkis yra tas, kad reikia nemažai išmokti – o naršyklėms keičiantis kiekvieną dieną, tai, kas gerai veikia šiandien, rytoj gali nebeturėti prasmės, nes bus palaikomi nauji stiliai, o kiti dėl vienokių ar kitokių priežasčių atsisakoma arba nebetinkami. .

CSS mokymosi kreivė to verta

Kadangi CSS gali būti pakopinis ir derinamas, o atsižvelgiant į tai, kaip skirtingos naršyklės gali skirtingai interpretuoti ir įgyvendinti direktyvas, CSS gali būti sunkiau išmokti nei paprastą HTML. CSS taip pat keičiasi naršyklėse taip, kaip HTML tikrai ne. Tačiau kai tik pradėsite naudoti CSS, pamatysite, kad išnaudoję stiliaus lapų galią suteiksite neįtikėtinai lanksčias tinklalapių išdėstymo ir jų išvaizdos apibrėžimo ypatybes. Pakeliui sukaupsite „krapšelį gudrybių“ stilių ir požiūrių, kurie jums pasiteisino praeityje ir kuriuos galėsite vėl panaudoti kurti naujus tinklalapius ateityje.