CSS деген не және ол қайда қолданылады?

Каскадты мәнерлер кестелері дегеніміз не?

Веб-сайттар суреттер, мәтіндер және түрлі құжаттар қоса алғанда, бірнеше жеке бөліктерден тұрады. Бұл құжаттар тек PDF файлдары сияқты әртүрлі беттерден байланыстырылуы мүмкін беттерді ғана емес, сондай-ақ беттер мен CSS (Cascading Style Sheet) құжаттарының құрылымын анықтау үшін HTML құжаттары сияқты өз беттерін құру үшін пайдаланылатын құжаттарды қамтиды. беттің көрінісін белгілеу. Бұл мақала бүгінгі күнгі веб-сайттарда қолданылатын нәрсені қамтитын CSS-ге кіреді.

CSS тарихы сабағы

CSS алдымен 1997 жылы веб-әзірлеушілерге өздері жасаған веб-беттердің визуалды көрінісін анықтауға мүмкіндік беретін құрал ретінде жасалды. Веб-мамандар веб-сайттың кодының мазмұнын және құрылымын көрнекі дизайннан ажыратуға мүмкіндік берді, бұл осы уақытқа дейін мүмкін болмады.

Құрылымның және стилдің бөлінуі HTML-ға бастапқыда негізделген функцияны көбірек орындауға мүмкіндік береді - мазмұнның белгіленуі, беттің өзін «дизайны мен сезімі» деп аталатын беттің дизайны мен орналасуына алаңдамай, беттің.

Веб-браузерлер осы таңбалау тілінің негізгі қаріптері мен түстік аспектілерінен артық пайдалана бастаған кезде, 2000-ға дейін CSS танымал болмады. Бүгінде барлық заманауи браузерлер CSS-тің барлық деңгейі 1-де, CSS-нің 2-деңгейінің көпшілігін және тіпті CSS-нің 3-деңгейінің көптеген аспектілерін қолдайды. CSS бұрынғыдай дамып келе жатқанда және жаңа стильдер енгізілсе, веб-браузерлер бұл браузерлерге CSS-ді жаңа CSS-ті қолдана алатын модульдерді енгізе бастады және веб-дизайнерлерге жұмыс істеу үшін қуатты жаңа стилі құралдарын береді.

Көптеген жылдар өткеннен кейін веб-сайттарды жобалау және дамыту үшін CSS-ні ​​пайдаланудан бас тартқан веб-дизайнерлер таңдалды, бірақ бұл тәжірибе бүгінгі күні саладан кетіп қалды. CSS қазір веб-дизайнда кеңінен қолданылатын стандарттар болып табылады және бүгінгі күні салада жұмыс істейтін кез-келген адамды табу үшін қиындық тудыруы мүмкін, ол кем дегенде осы тіл туралы негізгі түсінікке ие болмады.

CSS - бұл аббревиатура

Жоғарыда айтылғандай, CSS термині «Каскадты стиль кестесін» білдіреді. Осы фразаны осы құжаттардың немен айналысатындығын толығымен түсіндіру үшін біраз қысқартамыз.

«Стильдік парақ» сөзі құжаттың өзін білдіреді (HTML сияқты, CSS файлдары - әртүрлі бағдарламалармен редакциялауға болатын нақты мәтіндік құжаттар). Стиль кестелері көптеген жылдар бойы құжат жасау үшін пайдаланылды. Олар баспа немесе онлайн режимінде орналасу үшін техникалық сипаттамалар. Баспа дизайнерлері өздерінің конструкциялары өз ерекшеліктеріне сәйкес басып шығарылғанын қамтамасыз ету үшін ұзақ уақыт стильдер кестелерін қолданған. Веб-парақ үшін стилистикалық парақ бірдей мақсатқа қызмет етеді, бірақ веб-шолғышты қарауға болатын құжатты қалай жасайтынын айтып беретін функционалдығы бар. Бүгінгі күні CSS стильдерінің парақтары беттердің әртүрлі құрылғылар мен экран өлшемдерін көру әдісін өзгерту үшін медиа сұрауларын пайдалана алады. Бұл өте маңызды, себебі ол бір HTML құжатына қол жеткізу үшін пайдаланылатын экранға сәйкес әр түрлі түрде көрсетіледі.

Каскад - бұл «каскадты стиль кесте» терминінің ерекше бөлігі. Веб стилі парағы сол парақтағы стильдер сериясынан, мысалы, сарқыраманың үстіндегі өзен секілді каскадталған. Өзендегі су сарқыраманың барлық тастарына шабуылдайды, бірақ төменгі жағында ғана судың ағыны қайда барады. Веб-сайттың стильдер кестесіндегі каскадқа қатысты.

Веб-дизайнер кез-келген стильді қолданбайтын болса да, әрбір веб-бетке ең болмағанда бір стиль парағы әсер етеді. Бұл стиль парағы - пайдаланушы агенттерінің стилі парағы - егер веб-шолғыш басқа нұсқаулар берілмесе, бетті көрсету үшін пайдаланатын әдепкі мәнерлер ретінде де белгілі. Мысалы, әдепкі бойынша гиперсілтемелер көк түспен көрсетілген және олар сызылған. Бұл мәнерлер веб-шолғыштың әдепкі мәнері парағынан келеді. Егер веб-дизайнер басқа нұсқауларды ұсынса, браузер қандай нұсқаулардың басымдықты екенін білуі керек. Барлық браузерлердің өздерінің әдепкі мәнері бар, бірақ олардың көбісі (көк сызылған мәтін сілтемелері сияқты) барлық немесе негізгі браузерлерде және нұсқаларда ортақ пайдаланылады.

Браузердің әдепкі бойынша басқа үлгісі үшін менің веб-браузерімде әдепкі қаріп өлшемі « Times New Roman » өлшемі 16 өлшемінде көрсетіледі. Мен баратын беттердің ешқайсысы сол қаріп тұқымдасы мен өлшемінде көрсетілмейді. Себебі, каскадтың өзі дизайнерлердің өздері белгілеген екінші стиль кестелерін қаріп өлшемін және отбасын қайта анықтау үшін , менің веб-браузерімнің әдепкі мәндерін басымырақ деп анықтайды. Веб-парақ үшін жасайтын кез-келген стильдер браузердің әдепкі мәнерлеріне қарағанда ерекше сипатқа ие болады, сондықтан бұл мән-жайлар сіздің мәнер кестеңіз оларды алмастырмаса ғана қолданылады. Егер сіз сілтемелердің көк және асты сызылғанын қаласаңыз, онда сіз ештеңе істеудің қажеті жоқ, себебі ол әдепкі болып табылады, бірақ егер сіздің сайтыңыздың CSS файлы сілтемелер жасыл болса, бұл түс әдепкі көк түспен бас тартады. Астыңғы сызба осы мысалда қалады, өйткені сіз басқаша айтқан жоқсыз.

CSS қолданылған қайда?

CSS, басқа веб-сайттарда веб-шолғыштан қарағанда, веб-беттердің қалай көрінетінін анықтау үшін де пайдаланылуы мүмкін. Мысалы, веб-беттің қалай басып шығарылатындығын анықтайтын басып шығару мәнерінің парағын жасауға болады. Навигация түймешіктері немесе веб-пішіндер сияқты веб-беттер элементтері басып шығарылған бетте ешқандай мақсатқа ие болмағандықтан, басып шығарылған стиль кестесін бет басып шығарылған кезде сол жерлерді «өшіру» үшін пайдалануға болады. Көптеген сайттарда әдеттегі тәжірибе болмаса да, басып шығару стилінің парақтарын құру мүмкіндігі қуатты және тартымды (менің тәжірибем - көптеген веб-мамандар мұны жасамайды, себебі сайттың бюджет көлемі осы қосымша жұмыс жасауды талап етпейді) ).

Неге CSS маңызды?

CSS - бұл веб-дизайнер үйренетін ең қуатты құралдардың бірі, себебі сіз веб-сайттың бүкіл көрнекі көрінісіне әсер ете аласыз. Жақсы жазылған стильдердің парақтары жылдам жаңартылып, тораптарға басты HTML-нен түзетуге ешқандай өзгеріс енгізбестен, өз кезегінде, келушілерге құндылық пен фокус көрсететін экранда көрнекі түрде бейнелейтін нәрсені өзгертуге мүмкіндік береді.

CSS-нің басты міндеті - оқып-үйренудің аздығы, ал браузерлер күн сайын өзгеріп отырады, бүгінгі күні жақсы жұмыс істейтіндер жаңа стильдер қолдауға ие болады, ал басқалары бір себеппен немесе басқа себептермен түсірілуде .

CSS CSS-ні ​​каскадтауға және біріктіруге және әртүрлі браузерлердің директиваларды әртүрлі түсіндіруге және іске асыруға болатындығын ескере отырып, CSS қарапайым HTML-ке қарағанда күрделі болуы мүмкін. CSS-де браузерлерде HTML шынымен жоқ сияқты өзгереді. Сіз CSS-ні ​​пайдалануды бастағаннан кейін стиль кестелерінің күшін пайдалану сізге веб-беттерді қалай орналастыруға және олардың көрінісі мен сезімін анықтауға керемет икемділік беретіндігін көресіз. Айтпақшы, сіз болашақта сіз үшін жұмыс істеген және сіз болашақта жаңа веб-беттерді құрастырған кезде қайтадан оралуға болатын стильдер мен тәсілдердің «қылқаламына» айналасыз.

Дженнифер Крининнің түпнұсқа мақаласы. Jeremy Girard, 7/5/17,