Көбінесе ашылу тəгтерінің тигізетін əсерлерін түрлендіретін олардың атрибуттары
болады. Атрибуттар немесе сипаттамалар – тəг атауының жəне бір-бірінен бос орын
Кейбір атрибуттар оның мəнін жазуды талап етеді. Атрибут мəні оның түйінді сөзінен
теңдік белгісі (=) арқылы бөлініп жазылады. Атрибут мəні қостырнақшаға алынып
![]()
HTML тəгтерінің қосарланып жазылуына мысалдар:
HTML тəгтерінің жалқы жазылуына мысалдар:
HTML тəгтерінің атрибуттарымен бірге жазылуына
мысалдар:
BASK ROUND= ”RAIN. G1F”>
Құжатты безендіру тэгтері
Параметрлер тізімін толық берудің қажеті жоқ, көбінесе олардың бірде біреуі болмауы
да мүмкін, мұндайда олардың алдын-ала (үнсіз) келісім бойынша бекітілген мəндері
қолданылады.
BGCOLOR – құжаттың жалпы мəтінінің фоны түсін анықтайды, егер ол көрсетілмесе,
ақ түс қолданылады. Фон түсі ағылшын тіліндегі аттарымен немесе он алтылық сандар
түрінде RGB тəсілімен беріледі. Олар жайында кейінірек айтылады.
Мысалы:
мұнда фон сары түсті болады.
TEXT – мəтін əріптерінің түсін анықтайды, егер ол жазылмаса, келісім бойынша қара
түс қабылданған. Фон түсін өзгерткенде соған үйлесімді символдар түсі бекітіледі. Бұл
да ағылшын тіліндегі аттарымен немесе он алтылық сандар түрінде RGB тəсілімен
беріледі.
LINK – гипермəтіндік сілтеме ретінде қабылданған сөз тіркесінің түсін белгілейді. Егер
көрсетілмесе, ол көк түс болып саналады.
VLINK – пайдаланылған гипермəтіндік сілтеме түсін анықтайды. Келісім бойынша ол
қызылқоңыр түс болып саналады.
ALINK – гипермəтіндік сілтемені курсор көрсетіп тұрған кездегі оның түсін белгілейді.
Бұл параметр өте сирек өзгертіледі.
BACKGROUND – мəтіннің фонында орналасатын суретті анықтайды, ол түсқағаз
(обои) рөлін атқарады. Суреттік файлдың типі gif немесе jpg болуы тиіс.
Суреттің адресі көрсетілсе, ол Интернет желісінен тауып алынады. Мысалы:
background=”face.jpg”>
2. HTML тілінде түрлі түстер он алтылық сандар түріндегі RGB тəсілімен берілуі де
(COLOR= «#COFFCO» ), мүмкін, оның мүмкіндігі өте мол. Мұндағы алғашқы екі сан
қызыл (Red) түс бөлігін, келесі екі сан – жасыл түс (Green) бөлігін, соңғы екі сан көк
(Blue) түс бөлігін анықтайды. Жоғарыдағы көптеген параметрлер түсті пайдаланады,
олар ағылшын тіліндегі негізгі он алты түс атымен немесе солардың кодтарымен
төмендегідей түрде беріледі.
HTML 4.0 нұсқасынан (версиясынан) бастап кез келген құжатты əдемілеп əшекейлеу
ісін, сол құжаттан бөлек жасауға болатын болды, алайда бұл мүмкіндікті көптеген
броузерлер арқылы əзір жасауға болмайды. Сол себепті HTML тілінде, тек қана
құжаттарды безендіру үшін ғана қолданылатын тəгтер бар. Мүмкін, HTML
нұсқаларының алдағы түрлерінде осында жазылған кейбір тəгтердің қажеті болмайтын
шығар, бірақ əзірше оларды пайдалануға болады.
1. Əріптің мөлшерін, түсін жəне сызылымын таңдап алу үшін тəгін
пайдаланады. Бұл қосарланған тəг, оның ашылған жəне жабылған тəгтері арасында
орналасқан барлық мəтіндерді түрлендіруге болады. тəгінде қолдануға
болатын SIZE=…; COLOR= …; FACE=…; тəрізді үш атрибуттың бірі тұруы тиіс.
SIZE=… атрибуты əріптің көлемін (мөлшерін) тағайындайды. Əріптердің алдын ала
берілетін жеті түрлі көлемі бар, олар 1-ден 7-ге дейінгі сандармен белгіленеді. Бұл
сандар белгілі бір өлшем бірліктеріне сəйкес келмейді, тек санның мəні үлкейген
сайын əріптің де мөлшері ұлғаяды. Егер сан көрсетілмесе, келісім бойынша ол 3-ке
тең болып саналады.
COLOR= … атрибуты əріптің түсін таңдау мүмкіндігін береді, ол ағылшн тіліндегі
мағынасы бар түйінді сөз арқылы (мысалы, RED – қызыл) немесе RGB жүйесіндегі
он алтылық санмен (мысалы, #FF0000 – бұл да қызыл) берілуі мүмкін.
FACE=… атрибуты қаріп (шрифт) типін береді. Осы атрибуттың мəні компьютерде
орнатылған қаріптер атының біріне сəйкес келуі керек. Бірақ Интернетте орнатылған
құжатты
қабылдайтын
тұтынушының
компьютеріндеқндай
қаріптер
орнатылғандығын алдын ала білу қиын, сол себепті осы атрибутты көрсетпеген
дұрыс. Мысалы:
Алдарыңызда үшінші
мөлшермен arial типімен жазылған қызыл түсті əріптер”
Мұның нəтижесі:
Алдарыңызда үшінші мөлшермен arial пішімімен жазылған қызыл түсті əріптер
2. Осы параметрлердің барлығын бүкіл құжат үшін бірлен беру қажет болса, онда
атты бір ғана тəг пайдаланылады. Бұл тəгте де жоғарыда келтірілген
атрибуттар пайдаланылады, олар қаріп түрін, түсін жəне мөлшерін анықтайды, егер
олардың нақты мəндері көрсетілмесе, үнсіз келісім (по умолчанию) тəсілі бойынша
Black=«#000000» қара
Silver=«#C0C0C0» күміс түсті
Gray=«#808080» сұр
White=«#FFFFFF» ақ
Maroon=«#800000» қызылкүрең
Purple=«#800080» күлгін
Red=«#FF0000» қызыл
Fuchsia=«#FF00FF» қызғыш
Green=«#008000» жасыл
Lime=«#00FF00» лимон түсті
Olive=«#808000» кофе түсті
Yellow=«#FFFF00» сары
Navy=«#000080» қара көк
Blue=«#0000FF» көгілдір
Teal=«#008080» шай түсті
Aqua=«#00FFFF» көк
белгілі бір мəндер таңдалып алынады.
3. Тəгтердің тағы бір арнайы тобы қаріптердің сызылымын (начертание) өзгерту
мүмкіндігін береді. жəне тəгтері араларында орналасқан мəтін
қарайтылған қаріпке ауысады. жəне тəгтері қаріптерді курсивпен берсе,
жəне
тəгтері мəтіндердің астын сызып,
жəне
тəгтері-
белдерінен сызылған символдарды бейнелейді. Мысалы:
Қаріп типін, түрін, мөлшерін басқару
Негізгі қаріп Arial KZ типінде төртінші мөлшермен жазылған
Бұл мəтін əріптері алдыңғыдан екі мөлшерге ұсақтау жəне ол басқа қаріп типі мен
жасыл түсті қолданады.
қарайтылған қаріп түрі
қисайтылған курсивпен жазылған қаріп түрі
асты сызылған қаріп түрі
белінен сызылған қаріп түрі
Мəтін фрагменттерін белгілеп ерекшелеу тəсілдері
Мəтіндерді төмендегідей түрде ерекшелеуге болады
қалыңдатылған қарайтылған қаріптермен немесе
қисайтылған курсивпен немесе
асты сызылған символдар арқылы жазуға болады.
Оған қоса мəтіндерді ендері бірдей қаріптер арқылы логикалық стильде жазу
мүмкіндіктері де бар.
Логикалық стильдер түрлері:
EM - ағылшынның emphasis – акцент сөзінен шыққан, яғни курсив түрінде
берілген мəтін бөлігі
STRONG - ағылшынның strong emphasis – күшті акцент дегені, мəтін
ішінде қарайтылған қаріп болып көрсетіледі.
CODE – программа мəтінін көрсету үшін қолданылатын стиль түрі.
SAMP - ағылшынның sample - мысал, үлгі деген сөзі, программа жұмысы
нəтижелерін ендері бірдей моношрифт түрінде экранға шығарарда пайдаланылады.
KBD – keyboar – пернетақта (клавиатура) қысқаша сөзі. Пернелерден
негізілген сөз тіркестерін көрсету мақсатында қолданылады.
VAR – variable - айнымалы сөзі, программадағы айнымалы аттарын жазу үшін
енгізілген стиль түрі, қисайтылған курсивке ұқсас қаріп түрі.
Сырғымалы жолдар мысалдары
DIRECTION=”RIGHT” HEIGHT=30> Бұл алғашқы сырғымалы жол
WIDTN=”90%”> Бұл екінші сырғымалы жол
DIRECTION=”LEFT” HEIGHT=30>
Бұл үшінші сырғымалы жол
Сəлем!
Бұл HTML құжаттың ең қарапайым мысалы.
Мəтіндер алты түрлі көлеммен көрсетіле алады. Олардың түсін
де, қаріп типін де, фон түсін де өзгертетін мүмкіндіктер бар. Мəтін
ішіне суреттер орналастыруға да болады.
…
Сəлем!
Бұл HTML-құжаттың сəл күрделірек мысалы
Енді біз абзацты, тек сол жақ шетке ғана туралап жазбай,
ортаға қарай
немесе оң жақ шетке де туралауға болатындығын білеміз.
Сəлем!
Бұл HTML-құжаттың ең қарапайым мысалы.
Бұл *.htm файлды Notepad жəне Internet Explorer-де ашуға
балоды. Өзгертулер енгізгеннен кейін Блокнотта АТЫ.HTM деген
форматта сақтаңыз. Енді өзгертулердің HTML-құжатқа енгізгенін
көру үшін, файлды жауып, АТЫ.HTM құжатын шақырыңыз.
белгі абзацты бөлмей, келесі сөзді жаңа жолға керек болған жағдайда
қолданылады. Өлең жазуға ыңғайлы. Өлеңнен мысал келтірейік:
3-мысал
Өлең
Абай
Айттым сəлем, Қаламқас
Саған құрбан мал мен бас.
Сағынғаннан сені ойлап,
Келер көзге ыстық жас.
Көзімнің қарасы,
Көңлімнің санасы.
Бітпейді іштегі,
Ғашықтық жарасы.
Көлденең сызықтар жинағы
Өлең
Абай
Айттым сəлем, Қаламқас
Саған құрбан мал мен бас.
Сағынғаннан сені ойлап,
Келер көзге ыстық жас.
3– лабораториялық жұмыс
1. Гиперсілтеме бойынша ауысу - (анкер) тəгі
HTML-да мəтіннің бір фрагментінен екіншісіне ауысу үшін
HREF=«[ауысу адресі]»> белгіленген фрагменті тəгінің көмегімен орындалады.
[ауысу адресі] параметрінің аргументтердің бірнеше түрін қолдануға болады. Ең
қарапайымы – ауысатын HTML-құжатына атын беру. Мысалы:
Мазмұн
Бұл мысал HTML-құжатта Мазмұн белгіленген фрагмент пайда болады, оған
тышқан курсорын апарып шерткенде келесі терезеде pr2.htm құжаты ашылады.
Назар ауддарыңыз: егер адресте каталог (бума) көрсетілмесе, онда ауысу
ағымдағы каталог орындалады. Ашылған файлды көріп болғаннан кейін артқа қайтып
оралу үшін браузердің тақтасындағы НАЗАД батырмасын басу керек.
Сонымен, егер сіз бір буманың ішінде орналасқан жəне бір – біріне сілтеме
жасайтын HTML құжаттар дайындасаңыз, бұл құжаттарды жергілікті желінің немесе
Интернетті компьютер бумаларына орналастырсаңыз да дəл бұрынғыдай жұмыс
жасайды. Енді сіз Интернетке қосылмай-ақ көптеген құжаттар коллекциясын
дайындауға мүмкіндігіңіз бар. Құжаттардың толық дайындалып, сынақтан өткеннен
кейін оны толығымен Интернетке орналастыруыңызға болады.
Қажет болған жағдайда сілтемені қандайда бір құжатқа емес сол құжаттың
ішіндегі бар сөзге жасауға болады. Ол үшін сілтеме барысында ашылатын құжатта
қандайда бір нүктесін немесе анкер ашу керек. Мысал арқылы таңдайық.
Мəселен, pr1.htm құжатынан pr2.htm құжатының “Ауысу аяқталды” (құжаттар
бір буманы орналасқан) деген сөзіне көшу керек делік. Алдымен, pr2.htm файлында
мынадай анкер аш.
Ауысу аяқталды
“Ауысу аяқталды” сөзі мəтінде ешқандай белгілеусіз жазылады. Енді pr1.htm файлында
анкерге көшуді анықтау керек:
Переход к анкету (Анкерге ауысу)ААА
Анкерге ауысуды pr2.htm құжатының ішінде де орындауға болады, ол үшін құжат ішіне
фрагмент қосу жеткілікті:
Переход к анкету (Анкерге ауысу)ААА
Бұл үлкен құжаттар жасағанда өте қолайлы. Құжаттың басына бөлімдердің
тақырыбы орналасқан анкерлерге сілтеме жасайтын мазмұнды орналастыру керек.
Түсініспеушілік болмас үшін анкерлердің аттарын латын əріптерімен берген
дұрыс. Анкер атының жазылуын қадағалаңыз: көптеген браузерлер үлкен əріптерді
кіші əріптерден ажырата алмайды. Егер анкер атын ААА деп анықтап, ал анкерге
сілтемеде ааа немесе АаА деп жазсаңыз, онда құжат дұрыс ашылса да ААА анкеріне
шыға алмайсыз.
Осыған дейін біз тек HTML-құжатқа сілтеме жасауды сөз еттік, алайда
ресурстардың барлық түрлеріне сілтеме жасауға болады:
Файлдытүсіру
Бұндай сілтеме орындалған жағдайда, файлдарды беру протоколын іске қосып,
server сервер
directory бумасында орналасқан
file.ext файлын қолданушының жергілікті
дискісіне түсіре бастайды.
Хат жіберу
Егер қолданушы жоғарғыдағыдай сілтемеге ауысса, онда экранда пошта
программасының мəліметтерін енгізу терезесі ашылады. Пошта программасының То:
(“Қайда”) жолында user@mail.box көрсетіледі.
Байланыстар жайлы білетініміздің барлығын 2-мысал көмегімен талдайық.
2-мысал
<Байланыстыру
Сілтеудің көмегімен басқа файлдарға көшу болады (мысалы
«pr.htm»>осы нұсқаудың мазмұны ).
Файлдарды түсіруге болады (мысалы,
Nikolai/html-pr.doc»> бұл Microsoft Word 2.0 форматындағы нұсқау)FTP. бойынша
Қолданушыға поштамен мəлімет жіберуге мүмкіндік бар (мысалы,
):
Бұл мəтін суреттен кейін орналасады.
Бұл мəтін суретімен бөлінген.
Мұндайда сурет мəтіннен кейін пайда болады.
Бұл мəтін суреттің жоғарғы жағы бойынша тураланады.
Бұл мəтін суреттің ортасы бойынша тураланады.
Бұл мəтін суреттің төменгі жағы бойынша тураланады.
Бұл мəтін суреттің оң жағында жəне одан төмен орналасады.
Бұл мəтін суреттің сол жағында жəне одан төмен орналасады.
Бұл жерде басқа қаріп түрі пайдаланылған
Бұл қаріп таңдау мысалы.
1 өлшем
2 өлшем
3 өлшем
4 өлшем
5 өлшем
6 өлшем
7 өлшем
Негізгі тақырып
Ішкі тақырып
Үшінші абзацқа көшу
1.1Бірінші абзац
Бұл жолдар құжатта жеке-жеке жазылғанымен біртұтас болып көрсетіледі
2.1Екінші абзац
Абзацтар үшін жабылатын тəгтерді қою міндетті емес.
3.1 Үшінші абзац
Абзац басына тəг қойылуы тиіс.
Көлденең сызықтан кейінгі мəтін
екі жолға бөлінген.
Енді сызықтарды сызайық
pr6 мəтініне ауысып одан қайтып оралайық.
Иттің суретіне ауысып одан қайтып оралайық.
Жалаудың суретіне ауысып одан қайтып оралайық.
мысықтар
мысық
ит
бақа иттер
балық
WIDTH=500 HEIGIT=250 border=2 align=”bottom”
Енді өздеріңіз осындай суреттерге сілтеулері бар мəтіндер
жасаңыздар.
Бұл мəтінді экранға оқуға болады
Параграф командасын енгізбейінше мəтін біртұтас параграф
ретінде көрінеді.
Енді мəтін жаңа параграф ретінде көрінеді. Бұл мəтінді экранға оқуға болады.
Бұл қарайтылған мəтін
Бұл курсив мəтін.
Бұл асты сызылған мəтін
Бұл қарайтылған курсив мəтін
Бұл қарайтылған жəне
курсив, асты сызылған мəтіндер
Осы жерге тышқанмен бір шертіңіз!
Бұл жерге де тышқанмен бір шертіңіз!
<В> Бұл қарайтылған мəтін
Бұл курсив мəтін
Бұл асты сызылған мəтін
Бұл қарайтылған курсив мəтін
Бұл қарайтылған жəне
курсив, асты сызылған мəтіндер
Бұл мəтіннің түсі қызыл
Бұл мəтіннің түсі жасыл
Сырғымалы жолдар
DIRECTION=”RIGHT”
SCROLLAMOUNT= “10” SCROLLDELLAY=”200” WIDTH=”90%”>
Бұл бірінші сырғымалы жол
< MARQUEE BGCOLOR=”Green” DIRECTION=”LEFT”
HEIGHT=30 SCROLLAMOUNT= “10” SCROLLDELLAY=”100” WIDTH=”90%”>
Бұл екінші сырғымалы жол
Белгіленген тізім жолдары
Сəуле;
Мақсат;
Данияр;
Ержан
Анықтау тізімдері
HTML
HTML (HyperText Markup Language) термині – «гипермəтіндік белгілеу
тілі» деген сөз. Оның алғашқы нұсқасын Европадағы элементтер бөліктер
физикасы лабораториясының қызметкері Тим-Бернерс-Ли жасап шығарған
болатын.
HTML құжаты
Тіркеу аты *.htm (Unix жүйелеріндегі файлдарда*.html) болып келген
мəтіндік файл.
<> Қысқаша анықтамалар
АБАЙ
ХІХ ғасырдағы қазақ ақыны, əрі ағартушысы
Құрманғазы
ХІХ ғасырдағы қазақ сазгері, атақты күйші
Махамбет
ХVІІ ғасырдағы қазақ ақыны, əрі батыры- жыр семсері
Анықтау тізімдері
Нөмірленбеген тізімдер
Нөмірленбеген тізім элементтері сол жақтан арнайы таңбамен
белгіленіп, мəтін аздап оңға таман жылжып орналасды:
1 элемент;
2элемент;
3 элемент;
Нөмірленбеген тізім жолдары
Нөмірленген тізім элементтері сол жақтан нөмірлер арқылы
белгіленіпорналасады:
<ОL>
1 элемент;
2элемент;
3 элемент;
Анықтау тізімдері
Мұндай тізімдер алдыңғы екеуінен күрделірер, бірақ оқуға ыңғайлы
болады.
<Р> Тізімдерді бірінің ішіне бірін жазып қабаттастыруға болады, бірақ мүлде
көп деңгейлер жасап, бұл тəсілмен тым əуестеніп кету қажет емес екені есте
болсын.
<Р> Тізімдегі бір элемент ішінде бірнеше абзацтар тұруы мүмкін. Ондай
абзацтар сол жақ шеттен бірдей қашықтыққа ығысып орналасады.
Сəрсенбі күнгі <І> сабақ кестесі
Сəрсенбі күнгі
сабақ
кестесі
Сəрсенбі күнгі
сабақ
кестесі
Сəрсенбі күнгі
сабақ кестесі
2. Өзгертілген WEB-құжатты экраннан көріп шығыңыздар.
2 тапсырма.
Қолданылып отырған қаріптің көлемін өзгерту.
тэгі ағымдағы мəтін ішіндегі кейбір жолдарда қолданылып отырған
қаріптің көлемін 1-ден 7-ге дейін мөлшерде өзгерту мүмкіндігін береді.
1. RASP.HTM файлына төмендегідей өзгерістер енгізіңдер:
Менің алғашқы парағым
Алғашқы HTML файлы
2. Осы тэгін пайдаланып «сабақ кестесі» сөздерінің мөлшерін өз
қалауыңызша өзгертіп көріп шығыңдар.
3. Мəтін бөліктерін жоғарыда айтылған ерекшелеу түрлерін жəне келесі жолға көшу,
жаңа абзац ашу тэгтерін пайдалана отырып бірнеше тəсілмен безендіріңіздер.
3.тапсырма. Қаріп гарнитурасы (типі) мен түсін өзгерту.
тэгі мəтін бөліктерінің көлемін, типін жəне түсін өзгертуге мүмкіндік
береді. Қаріп типін өзгерту тэгіне FACE атрибутын қосу арқылы орындалады.
Мысалы, мəтін бөлігін KZ Arial қарпімен жазу үшін:
=”KZ Arial ” тэгін қолдану қажет.
Қаріп түсін беру үшін тэгінің COLOR=”X” атрибутын жазу керек. Мұндағы
Х орнына ағылшын тіліндегі түс атын немесе оның он алтылық жүйедегі сандық мəнін
жазса болады. Он алтылық санды қолданғанда, түс құрамындағы қызыл (R-Red), жасыл
(G-Green), көк (B-Blue) бояулардың араласу мөлшерін 00 мен FF сандары
аралығындағы мəндермен көрсету керек. Осы тəсілді бояу түсін көрсетудің RGB
форматы деп атайды.
1. RASP.HTM файлына төмендегідей өзгерістер енгізіңдер:
Менің алғашқы парағым
Алғашқы HTML файлы
тэгінде көрсетіледі. Осы
тэгтің BGCOLOR=… атрибуты құжаттың фон түсін, TEXT=… атрибуты эалпы мəтін
түсін анықтайды. LINK=… жəне VLINK=… атрибуттары əлі қаралмаған жəне қаралған
сілтемелік сөздер түсін тағайындайды (соңғы екеуі кейінірек қарастырылады).
RASP.HTM файлына төмендегідей өзгерістер енгізіңдер:
Моя первая страница
Учебный файл HTML
Расписание
занятий на Сейсенбі
Сəрсенбі күнгі
сабақ кестесі
Учебная
информационная система "ХКЛФМШ"
выполнена слушателями
Хабаровской краевой летней физико-математической
школы
в 2007 году в рамках занятий по курсу
"HTML:
работа с базами данных в примерах".
Она является незавершенным продуктом,
демонстрирующим возможности разработки специальных приложений
с помощью языка разметки гипертекста HTML.
Авторский коллектив слушателей ХКЛФМШ:
Семенова Юлия,
Иванов Петр и т.д.
Преподаватель: Табачук Наталья Петровна
E-mail: tabachuk@yandex.ru
«Администрация и Преподаватели» кестесін құру
Преподаватели
border="4"background="фон_Альбатрос1.jpg">
Список преподавателей
align="center"> Фамилия
Имя
Отчество
Дата рождения
Должность
Место работы
Фотография
Читаемый курс
Мендель
Виктор |
Васильевич |
|
доцент кафедры геометрии |
|
|
Математика
Ледовских
Ирина |
Анатольевна |
|
доцент кафедры информатики и информационных
технологий |
|
|
курсы.html">Информатика
Табачук
Наталья |
Петровна |
|
старший преподаватель кафедры информатики и
информационных технологий |
|
|
курсы.html">Информатика
