Стильдердің каскадты кестелері немесе жай стильдер кестесі (CSS – Cascading Style Sheets) – HTML кодтың түрлі фрагменттерін форматтауды жазатын және одан бөлек сақталатын ережелер терісі. Қандай да бір фрагментті форматтауды немесе фрагмент кодының біртипті тобын форматтауды көрсететін ережені стиль деп атайды. Стильдер кестесі CSS ерекше тілінде жазылып, css кеңейтілімге ие ерекше файлдарда сақталынады. Стильдер кестесін өз іс-тәжірибеңізде үйренгеніңіз жөн.
7.1.1. тапсырма site-family-dr бумасынмен байланысқан сайтпен жұмыс жасаймыз. Тәжірибе үшін бізге үш бет қажет болады. Блакнотта бос мәтіндік файл жасап, оны styles.css атымен сақтаңыз. Бұл файлда веб-бетті басқару стильдері бойынша барлық командаларды жазып отырамыз. Мұндай файлдың кеңейтілуі әртүрлі болуы мүмкін - txt, htm, html, css және т.б. Алайда өңдеу барысында іздеуге жеңіл болуы үшін css қолдану қабылданған. әрбір тақырыбында үш дәреже (Н1-Н3 тегтері), екі-үш абзац (Р тегі) және гиперсілтемесі (А тегі) бар жанама құрамды екі веб-бет жасаңыз. Тек қана керекті атрибуттарды пайдаланып, қысқаша код жазыңыз. Беттерді 1.htm и 2.htm. файлдарында сақтаңыз.
Егер де мәтінді орыс алфавиттерімен енгізе алмасаңыз, онда HTML құжаттың тақырыбына келесі қатарды енгізіңіз:
HREF атрибуты стильдерді жазудың сыртқы файлдары үшін адресті береді (URL). Ол абсолютті немесе салыстырмалы болуы мүмкін. Бұл жағдайда біз барлық файлдарды бір бумаға сақтағанбыз, сондықтан адрес ретінде файл атын көрсетуімізге болады. Құжаттың сыртында орналасқан стильді жазу сілтемесі HEAD элементін орналастыратын LINK элементінің көмегімен орындалады.
экран бетінде екі веб-бетті және мәтіндік файл styles.css бірдей ашыңыз. Терезеде барлық ақпараттың орналасуы міндетті емес. мысалы, веб-бет былай көрінуі мүмкін: Қызықты саяхатқа дайынсыздар ма? Алға! Осы екі бет өзіңіздің ұйымыңыз үшін ұзақ уақыт жасаған суперсайтыңыздың бөлігі болсын. Сіз үлкен мақтанышпен сайтыңызды бастығыңызға көрсетіп жатырсыз. Ал ол өз ойынан айнып, беттің басқа түрін қалап отыр, мысалы абзац мәтінінің түсі көктем келгенінің себебімен жасыл болғанын қалайды. сіз ойланып қалдыңыз. Беттегі барлық мәтіннің түсін алмастыру оңай. Алайда бұл жерде тек ғана абзацтарды ғана өзгерту керек. Арине, барлық азбзацтарға COLOR атрибутыменен FONT тегін қоюға болады. Алайда бұл беттері көр болса үлкен және бірбетті жұмыс. Күзде қоңыр, қыста – көк түсті талап етеді. Алайда мұның барлығын веб-шебер жасайды ғой. Алайда бұл қорқынышты жұмыс. Бірақ сіз қорықпаңыз, себебі алдын қарастырғанымыздай, мұны стильдер кестесіндегі кішкене бөлігін өзгерту арқылы жасауға болады.
7.1.2 тапсырма styles.css файлына келесі кодты теріңіз:
p {color:#00ff00}
Мынаған мән беріңіз, CSS файлына веб-беттің құрылымын анықтаушы ешқандай қосымша тегтерді жазу қажет емес. берілген жағдайда, барлық файл тек қана ұсынылған бір қатар дан тұрады. Файлды сақтап, веб-бет экранын жаңартыңыз. Үлкен күрделі жұмыстың орнына біз бірнеше минутта көптеген беттердің алпеттерін өзгерттік.