1.2 CSS тарихы CSS стильдің каскадты кестелері HTML ден кейін, 1997 жылы пайда болды. CSS-тің HTML-мен жұмыс жасағанына қарамастан, ол HTML емес. сонымен қоса, CSS өзімен бар HTML тегтерді анықтай отырып, HTML мүмкіндіктерін кеңейтетін жеке кодты ұсынады. Бұл WWW мәтіндік құжаттарды алмасу тәсілі ретінде, ал HTML осы құжаттар жасалынатын тіл болғандығымен байланысты. Жауынгерлер мен ғылымдар үшін құжаттың көріктілігі емес, оның құрамы қызықтырды. Сондықтан да, HTML-дің алғашқы жобаларында веб-беттерге бейнені қосу әдістері болмаған. Бірақ, уақыт өте келе интернетке басқа да пайдаланушылар келіп, олар өздеріне әсем етіп жасауды талап етті. Осылайша, веб-дизайнерлердіңғ жұмысын жеңілдету мақсатымен жасалынған стильдердің каскадты кестелері пайда болды. қазіргі уақытта CSS1 және CSS2 қабылданған. Үшінші деңгей (CSS3) өңделу үстінде. Алайда, оны шығарғаннан кейін де браузерлер оны бірнеше жылдан кейін ғана қолдана алады. CSS3 –тің алдынғы жобалардан ең негізгі ерекшелігі масштабталатын векторлық графика болып табылады. Яғни, векторлық графиканың барлық мүмкіндіктері енді интернетте де қол жетімді болады. Алайда, стильдер кестесінің бірінші дәрежесі де (CSS1) тамаша мүмкіндіктерді ұсынады.
1.3 CSS негіздері Стильдердің каскадты кестелері немесе жай стильдер кестесі (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 құжаттың тақырыбына келесі қатарды енгізіңіз:
HEAD тегіне құжаттың сыртында орналасқан стильді жазу сілтемесін орналастырыңыз, біздің файлымыз styles.css:
HREF атрибуты стильдерді жазудың сыртқы файлдары үшін адресті береді (URL). Ол абсолютті немесе салыстырмалы болуы мүмкін. Бұл жағдайда біз барлық файлдарды бір бумаға сақтағанбыз, сондықтан адрес ретінде файл атын көрсетуімізге болады. Құжаттың сыртында орналасқан стильді жазу сілтемесі HEAD элементін орналастыратын LINK элементінің көмегімен орындалады.
экран бетінде екі веб-бетті және мәтіндік файл styles.css бірдей ашыңыз. Терезеде барлық ақпараттың орналасуы міндетті емес. мысалы, веб-бет былай көрінуі мүмкін: Қызықты саяхатқа дайынсыздар ма? Алға! Осы екі бет өзіңіздің ұйымыңыз үшін ұзақ уақыт жасаған суперсайтыңыздың бөлігі болсын. Сіз үлкен мақтанышпен сайтыңызды бастығыңызға көрсетіп жатырсыз. Ал ол өз ойынан айнып, беттің басқа түрін қалап отыр, мысалы абзац мәтінінің түсі көктем келгенінің себебімен жасыл болғанын қалайды. сіз ойланып қалдыңыз. Беттегі барлық мәтіннің түсін алмастыру оңай. Алайда бұл жерде тек ғана абзацтарды ғана өзгерту керек. Арине, барлық азбзацтарға COLOR атрибутыменен FONT тегін қоюға болады. Алайда бұл беттері көр болса үлкен және бірбетті жұмыс. Күзде қоңыр, қыста – көк түсті талап етеді. Алайда мұның барлығын веб-шебер жасайды ғой. Алайда бұл қорқынышты жұмыс. Бірақ сіз қорықпаңыз, себебі алдын қарастырғанымыздай, мұны стильдер кестесіндегі кішкене бөлігін өзгерту арқылы жасауға болады.