Кои се Каскадни стилски листови?
Веб-страниците се состојат од голем број на поединечни парчиња, вклучувајќи слики, текст и разни документи. Овие документи не вклучуваат само оние кои можат да бидат поврзани со различни страници, како што се PDF датотеки, туку и документи што се користат за конструирање на самите страници, како што се HTML документи за да се утврди структурата на страницата и документите за CSS (Cascading Style Sheet) да диктира изглед на страница. Оваа статија ќе истражувам во CSS, покривајќи што е и каде се користи на веб-страниците денес.
Лекција за историја на CSS
CSS за прв пат беше развиена во 1997 година како начин за веб програмери да го дефинираат визуелниот изглед на веб-страниците што ги креираат. Таа беше наменета да им овозможи на веб-професионалци да ја раздвојат содржината и структурата на кодот на веб страната од визуелниот дизајн, нешто што не било возможно пред тоа време.
Раздвојувањето на структурата и стилот му овозможува на HTML да изврши поголема функција од она што првично беше засновано - обележување на содржината, без да се грижи за дизајнот и изгледот на самата страница, нешто што вообичаено се нарекува "изглед и чувство" од страната.
CSS не се здоби со популарност сè до 2000 година, кога веб прелистувачите почнаа да користат повеќе од основните аспекти на фонтот и бојата на овој јазик за означување. Денес, сите современи прелистувачи го поддржуваат целиот CSS Ниво 1, повеќето од CSS Ниво 2, па дури и повеќето аспекти на CSS Ниво 3. Додека CSS продолжува да се развива и да се воведат нови стилови, веб прелистувачите почнаа да имплементираат модули кои носат нова поддршка за CSS во тие прелистувачи и им овозможуваат на веб-дизајнерите да имаат моќни нови стилски алатки за да работат.
Во (многу) години од минатото, имаше избрани веб-дизајнери кои одбија да го користат CSS за дизајнирање и развој на веб-страници, но таа практика е сè уште помината од индустријата денес. CSS сега е широко употребуван стандард во веб-дизајнот и ќе биде тешко притиснат да најдат некој што работи во индустријата денес, кој немаше барем основно разбирање на овој јазик.
CSS е кратенка
Како што веќе споменавме, терминот CSS се залага за "Cascading Style Sheet." Ајде да ја скршиме оваа фраза малку за да објасниме што овие документи ги прават.
Зборот "стилски лист" се однесува на самиот документ (како HTML, CSS датотеки се навистина само текстуални документи кои можат да се уредуваат со различни програми). Стилските листови се користат за дизајн на документи за многу години. Тие се технички спецификации за распоред, без разлика дали се печатени или онлајн. Дизајнерите за печатење веќе долго време ги користат стилските листови за да осигураат дека нивните дизајни се испечатени токму на нивните спецификации. Стилскиот лист за веб-страница служи за истата цел, но со додадената функционалност исто така му кажува на веб-прелистувачот како да го прикаже документот што се гледа. Денес стилските листови на CSS исто така можат да ги користат медиумските пребарувања за да го променат начинот на кој страната бара различни уреди и големини на екранот . Ова е неверојатно важно затоа што дозволува единствен HTML-документ да биде прикажан поинаку според екранот што се користи за пристап до неа.
Каскадата е навистина посебен дел од терминот "лист со каскадни стилови". Веб лист со стил е наменет за каскада преку серија стилови во тој лист, како река над водопадот. Водата во реката ги погодува сите карпи во водопадот, но само оние на дното влијаат точно каде ќе тече водата. Истото важи и за каскадата во стилски листови за веб-страници.
Секоја веб-страница е под влијание на барем еден стилски лист, дури и ако веб-дизајнерот не применува никакви стилови. Овој стилски лист е лист за стил на кориснички агенти - исто така познат како стандардните стилови кои веб прелистувачот ќе ги користи за прикажување на страница, ако не се дадени други инструкции. На пример, по правило хиперврските се стилизирани со сина боја и се подвлечени. Овие стилови доаѓаат од стандардниот стилски лист на веб прелистувачот. Меѓутоа, ако веб дизајнерот обезбеди други инструкции, прелистувачот ќе треба да знае кои инструкции имаат предност. Сите прелистувачи имаат свои сопствени стандардни стилови, но многу од тие стандардни вредности (како сини подвлечени текстуални врски) се делат во сите или повеќето главни пребарувачи и верзии.
За друг пример за стандарден прелистувач, во мојот веб прелистувач, стандардниот фонт е " Times New Roman " прикажан со големина 16. Скоро ниту една од страниците што ја посетувам не се прикажува во тоа семејство и големината на фонтот. Ова е затоа што каскадата дефинира дека втората стил листа, која е поставена од самите дизајнери, да се редефинира големината на фонтот и семејството, надминувајќи ги стандардните вредности на мојот веб прелистувач. Сите стилски листови што ќе ги креирате за веб-страница ќе имаат повеќе специфичност од стандардните стилови на прелистувачот, така што оние стандардни ќе се применуваат само ако вашиот стилски лист не ги пребрише. Ако сакате врските да бидат сини и подвлечени, не треба да правите ништо, бидејќи тоа е стандардно, но ако CSS-датотеката на вашиот сајт вели дека линковите треба да бидат зелени, таа боја ќе ја замени стандардната сина боја. Подвлечениот ќе остане во овој пример, бидејќи не специфицираа поинаку.
Каде се користи CSS?
CSS исто така може да користи за дефинирање на тоа како веб-страниците треба да изгледаат кога се гледаат во други медиуми отколку веб-прелистувач. На пример, можете да креирате лист за стил на печатење кој ќе дефинира како треба да испечати веб-страницата. Бидејќи ставки на веб-страница како копчиња за навигација или веб-форми нема да имаат цел на печатената страница, може да се користи стилски лист за печатење за да ги "исклучи" оние области кога страницата е отпечатена. Иако не е вообичаена практика на многу сајтови, опцијата за креирање на страници за печатење е моќна и атрактивна (според моето искуство - повеќето веб професионалци не го прават тоа едноставно затоа што обемот на буџетот на страницата не бара да се направи дополнителна работа ).
Зошто е важно CSS?
CSS е една од најмоќните алатки кои веб дизајнерот може да ги научи, бидејќи со него може да влијае на целиот визуелен изглед на веб-страница. Добро напишаните стилски листови можат брзо да се ажурираат и да им овозможат на сајтовите да го менуваат она што е визуелно приоритет на екранот, што за возврат покажува вредност и фокус на посетителите, без никакви промени што треба да се направат до основната ознака за HTML.
Главниот предизвик на CSS е тоа што има многу да научиме - и со прелистувачите што се менуваат секој ден, она што денес добро функционира не може да има смисла утре кога ќе се поддржат новите стилови, а другите ќе бидат отфрлени или испаднат од корист поради една или друга причина .
Бидејќи CSS може да ги каскара и комбинира, и со оглед на тоа како различни прелистувачи можат поинаку да ги интерпретираат и имплементираат директивите, CSS може да биде потешко од обичен HTML за совладување. CSS исто така се менува во прелистувачите на начин кој HTML навистина не го прави. Откако ќе почнете да го користите CSS, сепак, ќе видите дека искористувањето на моќта на стилски листови ќе ви даде неверојатна флексибилност во начинот на изгледот на веб-страниците и дефинирање на нивниот изглед и чувство. На патот, ќе натрупате "торба на трикови" на стилови и пристапи кои работеле за вас во минатото и кои можете да се свртите кон повторно како ќе градите нови веб страни во иднина.
Авторски напис од Џенифер Крајнин. Ревидирани од Џереми Гирард на 7/5/17,