Сабақ жоспары  № _____      № Күні Топ Пәні:   Бағдарламалау. Сабақ тақырыбы:   Стильдерді  қолдану.   қолдану   Стильдерді Білімділік: туралы   мәлімет   беру, мүмкіндіктері туралы жалпы білімдерін толықтыру, жұмыстарын   белгіленген   уақыт   ішінде   орындауға   үйрету,   жұмыс жылдамдығын мен еңбек мәдениетін қалыптастыру; Дамытушылық:   Логикалық ойлау қабілетін, есте сақтау қабілетін, ой-өрісін және кесте режимінде жұмыс істеу, Access – те жылдам жұмыс жасау дағдыларын дамыту; Тәрбиелік:    Студенттерді  ұқыптылыққа, шапшаңдыққа,  адамгершілікке, Сабақтың мақсаттары тиянақтылыққа тәрбиелеу. Сабақтың типі: Аралас Сабақтың түрі Теориялық   САБАҚТЫ ЖАБДЫҚТАУ Сабаққа қолданылатын  әдебиеттер: Сабақта қолданылатын  көрнекіліктер мен құрал­жабдықтар:   Б.Б.Бөрібаев   А.Б.Дәулетқұлов. Е.Қ.Балапанов, информациялық технологиялар: Информатмкадан 30 сабақ».  Ж.Қ.Масанов, Б.А.Бельгибаев «Turbo Pascal». Алматы, 2004 ж., 20­21бб.   «Жаңа Компьютер, проектор, тақта. Сабақты жүргізу кезеңдері I. Ұйымдастыру кезеңі (1 мин.)     Студенттермен сәлемдесу;     Студенттерді түгендеу;     Студенттердің сабаққа дайындығын тексеру;     Студенттердің назарын сабаққа аудару. II. Үй тапсырмасын сұрау (7 мин) a) Қәріп дегеніміз не, олардың жазылу тәртібі? b) Қәріптердің қандай түрлері бар? c) Қәріп стильдер тегтердің қандай ерекшіліктері бар. IІI. Нұсқау  беру  (45 мин.) Стильдерді  қолдану. Веб­браузерлер контенттің сыртқы көрінісін, мәтіндердің және басқа да материалдардың орналасуын   анықтау   үшін   каскадтық   стильді   кестелерді   (Cascading   Style   Sheets   ­   CSS)   де  (World   Wide   Web қолданады.   HTML   және   CSS   стандарттарын   қадалаушы   W3C   ұйымы   Consortium   (W3C)  халықаралық   World   Wide   Web  (қысқаша   WWW   немесе   W3)   стандарттау ұйымы) HTML белгілеу тіліне CSS қосып пайдаланса, көрнектілеу болатынын айтады.     ə ə Каскадтық стильді кестелер ­ CSS (Cascading Style Sheets – Каскадтық стильді кестелер) –   HTML,   XHTML   ж не   т.б.   белгілеу   тілдерінде   жазылған   веб­беттердің   сыртқыкөрінісін суреттейтін,  рлейтін тіл болып есептеледі. Бұл тілде веб­беттердің сыртқы көрінісіндегі шрифтер, түстер, жайғасуы, блоктар сияқтыэлементтерді жасауға болады. CSS­тің пайда болуының негізгі себебі,белгілеу   тілдерінде   (HTML,   XHTML,   XML   ж не   т.б.)   веб­беттердіңлогикалық құрылымдары   мен   сыртқы   көріністерін   суреттеуді   бір­біріменбөліп   қарастыру   болды.   Себебі ə рқайсысы бөлек болса, сайт жасағанда да,сайттың кодын оқығанда да түсінуге ыңғайлы болады. ə Тарихы.  1990  жылдары   Веб  стандарттау  істері   қарқынды   дамыды  ж не   вебдизайнерлер үшін сайт жасауда ортақ бір стандарт керек болды. Сөйтіп,HTML 4.01, XHTML ж не стандарт CSS пайда болды. «Каскадтық стильді кестелер» терминін 1994 жылы Хокон Виум Ли енгізді. Хокон  Берт  БоспенCSS­ті  дамытып,   оған  Ғаламтор   Консорциумы   «Веб  стандарты»   деген  атау берді. Артықшылықтары: ə ə ə ə  Анық бақылау кодтың көлемін ед уір кемітеді ж не оны оқуға ыңғайлайды;  CSS тілі көмегімен HTML тілінде беруге болмайтын параметрлерді ашамыз;  Мысалға алатын болсақ, сілтемелердің астындағы сызықты алып тастауғаболады;  CSS арқылы веб­беттің сыртқы көрінісін оңай өзгертеміз. Көп құжаттардыңсыртқы көрінісін   бір   кесте   арқылы   көрсетуге   болады.   Мысалы,   сіз   30   беткодтағы   шрифттарды жасыл түс еттіңіз делік. Бірақ уақыт өткен соң, көк неқызыл түске өзгерткіңіз келіп, барлық 20 бетке кіріп, керекті атрибуттағы шрифті өзгертіп шығасыз. Ал CSS тілі арқылы сол 20 беттің барлығын бірғана стильдер кестесінде өзгертуге болады;  ұғым бар. Құрамалы ж не жинақталған дизайн техникасы. CSS тілінде сайт версткасы   деген ə Мысалы: .letter { font­family: Arial; font­size: 24pt; color: navy } "Д"имон,  сенде  транплюкаторға  ұқсас  бір  нәрсе  бар  “─ Менде транплюкатордың өзі бар!”. Осы сөзді айтып ма?”. “Ұқсасы несі?!”  балконға шығады және ол жерден біп нәрсені алады, сол сәтте ол заттың сол екенін түсінесің.  ─ Диманын жауабы  Әріпті  сол  жағынан  негізгі  мәтіннен  бөлуге  ештеңке  кедергі  бола  алмайды.Осы  әрекетпен қарапайым эффекті жасай аламыз. Әріпті орналастыру үшін міндетті түрде екі ұяшықты кесте құру керек, сол жағында бірінші символ, ал екінші жағында қалған мәтін орналасады. HTML­ге CSS жалғау. Сыртқы стильдік кестелер ­  Қарапайым HTML парақша жасап, мысал үшін оған мынадай кодсалыңыз:

Мынаубіріншідеңгейлітақырып

Бұл – мəтінніңорны

Мынау екінші деңгейлі тақырып

Бұл – мəтінніңорны Енді  блокноттан  жаңапарақша  ашып,  оның  атын  style.css  деп  жазып,  html­парақша  орнатылған папкаға сақтаңыз: Сурет 1 ­ style.css файлын сақтау Ол біздің стильдеріміздің парағы болады. Енді біз style.css парағын html­параққа жалғауымыз керек. Ол үшін html­де сыртқы файлдарды жалғауға жауап беруші  тегі бар. Осы тегті біздің html­парағымызға қосамыз:

Мынау бірінші деңгейлі тақырып

Бұл жер мəтіннің орны

Мынау екінші деңгейлі тақырып

Бұл жер мəтіннің орны ə Ережелер ж не селекторлар ­   CSS­тің басқа тілдер сияқты өзінің синтаксисі бар. Онда элемент   те,   параметр   де,   тег   те   жоқ.   Бұл   тілде   тек   ережелер   бар.   Ереже   селектордан   ж неə фигуралы жақшаның ішінде болатын стиль жариялайтын блоктан тұрады: Cтиль жариялайтын блоктың өзі сипаттан ж не оның мәнінен тұрады: ə Сурет 2 ­ CSS тілінің ережесі Сурет 3 ­ Cтиль жариялайтын блок Стильдерді қолдану – ол мәтіндегі сөздер арасындағы қашықтықты жасау үшін word­spacing параметрі қолданылады. Ол пиксельмен (рх), пунктпен (рt), миллиметрмен (mm) және басқа да бірліктермен қойыла алады. Мысалы:  word­spacing атрибутын қолдану Піл + жақсы тағам = екі піл Онда соңғы рет көрсетілген орталық және қолайлы қасиеттері көрсетіледі. Стильді бір рет кесте арқылы сипаттауға және веб­парақтың элементтеріне қолдануға болады.  IV. Тәжірибелік бөлім  (25 мин.) Тапсырмаларды орындау – Блокнот бағдарламасы арқылы теріп іске қосу: body{ background: blue; color: white; } h1{ color:red; } h2{ color:yellow; } p{ color:black; } p#pink{ color:pink; } Сергіту сәті:  Көзге жаттығу. V. Қорытындылау (10 мин.)  Өткен тақырыпқа сараптама жасау: 1. Айнымалыға сипаттама беру. 2. Тұрақтының екінші атын атаңыздар? 3. Идентификатор дегеніміз не? 4. Стандарттыға анықтама беру, мысалы келтіру. 5. Бейстандартты дегене не? Мысалы.  Жеткен жетістіктерді айту;  Жіберген кемшіліктерді көрсету;  Жұмыс орнын жинау. VІ. Бағалау (1 мин)  Белсенді студенттерді тапсырма бойынша бағалау. VІІ. Үй тапсырмасы  (1 мин) Мәлімет жинау.