HTML тілінің тегтері

Жұмыс түрі: Реферат
Тегін: Антиплагиат
Көлемі: 12 бет
Таңдаулыға:

ЕСЕП БЕРУ

Тақырыбы: « HTML. HTML тілінің негізгі тегтері»

Алматы 2020

Мазмұны

КІРІСПЕ . . . 3

1. HTML тілінің атқаратын қызметі . . . 4

2. HTML тілінің тегтері . . . 6

3. HTML құжатының құрылымы . . . 10

ҚОРЫТЫНДЫ . . . 12

ПАЙДАЛАНЫЛҒАН ӘДЕБИЕТТЕР . . . 13

Кіріспе

Интернеттің бар мәліметтерінің, яғни барлық Web-парақтарының бір ортақ қасиеті - олардың барлығы да HTML тілінде жазылған. HTML тілінде Web-парақтар жасау программалауға ұқсас болғанмен, ол қарапайым программа-лау тілі емес. HTML-гипермәтінді белгілеу тілі. Ол кәдімгі мәтіндерді Web-парақтар түрінде бейнелеуге арналған ережелер жиынын анықтайды. HTML тілі World Wide Web қызмет бабымен бірге дами отырып, Web-парақтары-ның ең жақсы деген мүмкіндіктерін жүзеге асырып, оны кең пайдалану жол-дарымен толықтырылып отырылды. Ол World Wide Web жүйесінің негізі бола отырып, оның өте кең тарауына себепші болды. World Wide Web сөзі қазақ тіліне “кеңейтілген бүкіл әлемдік өрмек” болып аударылады. HTML тілінің мағынасы мен атқаратын қызметін оның атынан анықтауға болады. Гипермәтін - қосымша элементтерді басқару мақсатында ішіне арнаулы код, яғни екпінді элемент орналасқан мәтін. Ол мәтін ішіне сурет немесе дыбыс енгізу, мәтінді безендіру, пішімдеу (форматтау) ісін орындайтын немесе осы құжаттың басқа бөлігіне сілтемесі бар алғашқы нүкте ретінде карастырыла-тын белгіленген сөз. Сөзді ерекшелеп белгілеу дегеніміз - келесі керсетілетін құжат бөлігі калай бейнеленетінін анықтайтын айрықша кодты осы сөз ішіне енгізу.

Гипермәтінді бейнелеу үшін броузер (browsers) деп аталатын арнайы көрсету программалары қолданылады. HTML тілінін атқаратын қызметі: Web-парақтары экранда ықшам түрде безендіріліп көрсетілгенімен, HTML тілі мәтіндерді пішімдеп керсететін тілге жатпайды, Өйткені әрбір тұтынушы әртүрлі компьютерлерді пайдаланады. Сол себепті жаңа ғана зауыттан шық-қан бір компьютердің Windows жүйесінде жұмыс істей алатын броузері бар болса, екінші бір тұтынушы компьютері тек MS DOS жүйесінде жұмыс істей-тін ескі броузерді пайдалануы мүмкін. Бұл екеуінің көрсету мүмкіндіктері әр-түрлі болғандықтан, бір файл екеуінде екі түрлі болып көрсетіледі. Ал, үшін-ші компьютердегі Web-парақтарының мәтіндері зағиптарға арналған Брайль қаріптері арқылы берілсе, оның нәтижесі тіпті басқаша болады.

1. 1. HTML тілінің атқаратын қызметі

HTML-құжатарында белгілеу модельдерінің негізі ретінде тегтер мо-делі қабылдалынған. Тегтер моделі құжатты контейнерлер ретінде түсінді-ріледі, мұндағы контейнерлердің әр қайсысы тегтермен басталып, тегтермен аяқталады. Яғни HTML құжаты кәдігімгі ASCII- файлға HTML басқару код-тары (тегтері) қосылған файл болып табылады.

HTML-құжатының тегтері көбінесе қолдануға және түсінуге жеңіл. Себебі олар ағылшын тілінің көпқолданбалы сөздерінен түсінікті түрде қыс-қартылып және белгіленіп алынған. HTML-тегі өзінің атынан, міндетті және міндетті емес атрибуттардан тұрады. Тег мәтіні бұрышты жақшалармен қор-шалады. Мысал ретінде қарапайым варианттардың бірі:<HEAD> немесе . Тегтердің күрделілігі олардың атрибуттарында болып табылады. Мұндағы атрибуттар тегтердің функцияларын өзгерту үшін қолданылады (көлемін, ұзындығын, түрін және т. б. ) .

Тегтер атрибуттары оның атынан кейін жазылады және бір-бірінен бір немесе бірнеше табуляция, пробел немесе жол басына қайтару символдары арқылы ажыратылады. HTML тілінде тегтер атрибуттарын кезекпен жазуды керек етпейді. Атрибуттың мәні атрибут атынан соң жазылатын теңдік белгі-сінен кейін жазылады. Егер атрибут мәні бір сөз немесе сан болып келетін болса, онда оны ешбір қосымша белгілеусіз теңдік белгісінен кейін жаза беруге болады. Басқа жағдайларда атрибут мәндерін бірлік немесе екілік тырнақшаларға алып жазу керек, әсіресе егер олар пробел арқылы бөлінген бірнеше сөз болса. Атрибут мәнінің ұзындығы 1024 символға дейін рұқсат етілген. Мысалға, әсіресе HREF атрибутының мәні ретінде басқа құжаттар-дың адресін (URL) көрсеткенде керекті регистрді қолдану маңызды болып табылады.

Көп жағдайларда HTML тегтері бастапқы және ақырлы компоненттер-ден тұрады және олардың арасына мәтін және басқа да құжат элементтері орналасады. Жабушы тегтің аты бастапқы тегтің атына сәйкес болып келеді, бірақ жабушы тегтің атының алдына көлденең сызықша (/) қойылады. Мыса-лы, шрифт түрі -курсив тегі үшін жабушы сыңары түрінде болады. Жабушы тегтер үшін атрибуттар ешқашанда қойылмайды, қойылса да ол атрибут қабылданбайды. Мәні бойынша тегтер әмбебап программалау тілде-рінің “begin \ end” белгілеулеріне түсінігі бойынша өте ұқсас болып келеді. Тегтер құжаттың мәтіндік интерпретациялау шартының әрекет ету ауданын анықтайды.

Ішкі тегтерді қолданғанда құжатта ерекше ұқыптылықты сақтау керек. Ішкі тегтерді соңғысынан бастап бастапқысына қарай жазып шығу керек. Кейбір HTML тегінің жабушы тегтері болмайды, өйткені олар автономды элементтер болып табылады. Мысалы, бейнелер тегі <IMG> жабушы компо-нентті қажет етпейді. Автономды тегтерге тағы да - жолдарды айыру, <HR>-көлденең сызық және көрсетілетін нәтижеге әсер етпейтін, тек қана құ-жат туралы ақпараттар сақтайтын <META> және <BASE> сияқты тегтер жатады.

Кейбір жағдайларда жабушы тегтерді жазбаса да болады. Көптеген браузерлер құжат мәтінін өңдегенде бастапқы тегті алдыңғы тегтің жабушы тегі ретінде қабылдайды. Ең көп тараған мұндай тегтің түрі абзац тегі - . Өйткені оны құжаттарда жиі қолданады және оны әдетте әр абзац алдына жазады. Бір абзац біткеннен кейін келесі тегі браузерге осы абзацты аяқтап жаңа абзац бастау керектігін көрсетеді.

Басқа бір жабушы тегтер түрі, жоқ болса да нәтижеге әсер етпейді және браузерлер оларсыз еш мүлтіксіз істей береді. Оларға мысал ретінде </HTML> тегін алуға болады. Сөйте тұрса да, әр жабушы тегтерді қойып отырған дұрыс. өйткені құжатты өңдеуден өткізгенде кейбір жаңылулар мен қателер болуы мүмкін.

HTML тілінің атқаратын қызметі.

Web-парақтар экранда ықшам түрде безендіріліп көрсетілгенмен, HTML тілі мәтіндерді пішімдеп (форматтап) көрсететін тілге жатпайды. Өйт-кені әрбір тұтынушы әр түрлі компьютерлерді пайдаланады. Сол себепті жа-ңа ғана зауыттан шыққан бір компьютердің Wіndows жүйесінде жұмыс істей алатын броузері бар болса, екінші бір тұтынушы компьютері тек MS DOS жүйесінде жұмыс істейтін ескі броузерді пайдалануы мүмкін. Бұл екеуінің көрсету мүмкіндіктері әр түрлі болғандықтан, бір файл екеуіне екі түрлі бо-лып көрсетіледі.

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

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

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

2. HTML тілінің тегтері

Web-құжат ( HTML-құжат ) - гипермәтінді белгілеу тілінде <HTML> және </HTML> тегтері арасында орналасады .

Тег (tag) - HTML тілінің кодтары, яғни мәтіндерді форматтайтын ко-мандалары. Кодтар - бұрыштық жақшаларға < > алынып жазылған ағылшын тілінің толық немесе қысқартылған сөз тіркестері.

Web-сайт, Web-сервер - бір-бірімен логикалық түрде байланысып, HTML тілінде жазылған құжаттар тізбегі.

Құжатты белгілеуге арналған HTML тегтері қызметтері.

Негізгі тегтер

<HEAD> . . . </HEAD> - бұлардың ортасында құжат туралы мәлімет орнала-сады және TITLE тегі тұруы мүмкін. <TITLE> . . . </TITLE> - бұлар броузер-программа маңдайшасында жазылатын терезе тақырыбын қоршап тұрады.

<BODY> . . . </BODY> - бұл екеуінің аралығында құжат "тұлғасы" (мәтін, графика, т. с. с. ) жайғасады.

<BОDY> тегінің параметрлері (атрибуттары) :

BGCOLOR - фон түсі (<BODY BGCOLOR ="#">) ;

BACKGROUND - фон орнына "түсқағаз" (обои) түрінде сурет беру (<BODY BACKGROUND ="BERKUT. JPG">) ;

TEXT - мәтін түсі (<BODY TEXT ="#00FF00">) ;

LINK - гипермәтіндік сілтеме (байланыс) түсі;

VLINK - алдында қаралған сілтеме түсі;

ALINK - осы сәттегі екпінді сілтеме (курсор меңзеп тұрған) түсі.

Мәтіндерді форматтау тегтері.

<Р> . . . </Р> - абзацты белгілейтін тегтер. Жаңа абзац алдыңғысынан бос жолмен бөлініп тұрады.

 - мәтінді келесі жолға көшіретін жалқы тег. Графиканы, суретті мәтін-нен бөліп тұру үшін де қолданылуы мүмкін.

<HR> - мәтіндерді бір-бірінен логикалық түрде бөліп тұратын көлденең сызық жүргізетін жалқы тег.

<PRE> . . . </PRE> - бұлардың ортасында алдын ала форматталған мәтін орна-ласады. Ондай мәтін экранға "курьер" (Courier New) қарпімен шығарылады.

Мәтін логикалық бөліктерін (тақырыптарын) ерекшелеу тегтері:

<Н1> . . . </Н1> - бірінші деңгей тақырыбы (ең ірісі) .

<Н2> . . . </Н2> - екінші деңгей тақырыбы . . .

<Н6> . . . </Н6> - алтыншы деңгей тақырыбы (ең кішісі) .

Туралау параметрлері.

<Р> және <Н*> тегтерінде қолданылады, олардың мәндері:

ALIGN=LEFT - сол жақ шетке жақындатып туралау;

ALIGN=RIGHT - оң жақ шетке жақындатып туралау;

ALIGN=CENTER - ортаға жылжытып туралау.

Туралау тегтері.

<LEFT> . . . </LEFT> - сол жақ шетке туралау;

<RIGHT> . . . </RIGHT> - оң жақ шетке туралау;

<CENTER> . . . </CENTER> - ортаға жылжытып туралау.

Мәтін бөліктерін ерекшелеу тегтері.

<В> . . . </В> - мәтінді (сөздерді, әріптерді) қалыңдатылған қаріппен ерекше-лейді.

 . . .  - мәтінді қисайтылған курсив қаріппен (Italic) ерекшелейді.

 . . .  - аралығындағы мәтіннің астын сызады.

<BLINK> . . . </BLINK> - аралығындағы мәтін жыпылықтап назар аудартып тұрады.

 . . . 

 . . .  - қаріп көлемін өзгертетін тегтер.

 . . .  қаріп түсін өзгертетін тегтер.

Сырғымалы жолдар тегтері

< MARQUEE> . . . мәтін . . . < /MARQUEE > - сырғымалы жол жасайды. Оның параметрлері:

DIRECTION=left - мәтін оңнан солға қарай сырғи отырып жылжиды;

DIRECTION=right - мәтін солдан оңға қарай сырғиды;

BEHAVIOR= scrol - мәтін стандартты түрде оңнан солға қарай сырғиды;

BEHAVIOR=slide - мәтін стандартты түрде оңнан солға қарай бір-ақ рет сырғиды да тоқтайды;

BEHAVIOR= alternate - мәтін оңнан солға қарай, содан соң кері қарай, т. с. с. шексіз сырғи береді;

LOOP=n - сырғу саны LOOP атрибутының мәні n- мен шектеледі;

WIDHT=n - сырғымалы аймақтың ені n- мен шектеледі, ол пиксельмен ( n ) немесе терезе енінің пайызымен де ( n% ) көрсетіле береді;

SCROLLAMOUNT=n - жылжудың бір қадамында мәтіннің қанша пиксельге жылжитынын анықтайтын бүтін сан;

SCROLLDELAY=n - екі сырғудың арасындағы интервалды миллисекундпен көрсететін бүтін сан;

BGCOLOR=”#” - сырғымалы жол аумағын басқа түске бояу, түс ағылшынша атымен немесе он алтылық кодымен көрсетіледі;

HEIGHT=n - сырғымалы жол биіктігін пиксельмен ( n ) көрсету;

<MARQUEE> . . . мәтін . . . </MARQUEE> - сырғыма-лы жол мәтінінің қаріп мөлшерін, типін, түсін әдеттегідей өзгертуге болады.

Тізім жасайтын тегтер

<OL> . . . </OL> - нөмірленген тізімнің басын, аяғын белгілейді;

<UL> . . . </UL> - белгіленген тізімнің басын, аяғын белгілейді;

<LI> - тізім элементтерін бастайды;

<DL> . . . </DL>  түсініктемелердің ( глоссарий) басын, аяғын белгілейді;

<DT> - сол жақ шетке жақын орналасқан глоссарий терминін сипаттайды;

< DD > - сол жақ шеттен оңға ығысып орналасқан глоссарий терминін сипаттайды.

Мәтіндік емес мәліметтерді орналастыру тегтері

<IMG SRC ="file. gif '> немесе <IMG SRC ="file. jpg"> - графикалық бейнелерді енгізу командасы.

<IMG SRC ="file. wav"> - дыбыстық фрагментті енгізу командасы.

<IMG SRC ="file. avi"> - бейнелік фрагментті енгізу командасы.

Графикалық бейнелерді енгізу тегтерінің параметрлері

WIDHT=n - суреттің пиксельмен берілген ені.

HEIGHT=n - суреттің пиксельмен берілген биіктігі.

ALIGN - суретті туралау (ALIGN=LEFT - сол жақ шетке туралау, ALIGN=RIGHT - оң жақ шетке туралау, ALIGN=TOP - жоғарғы жаққа мәтін жолын туралау, ALIGN=BOTTOM - төменгі жаққа мәтін жолын туралау, ALIGN=MIDDLE не CENTER - мәтін жолын ортаға туралау) .

HSPACE=n - графикалық бейнеден көлденең (горизонталь) бағытта қалдырылатын бос кеңістік (пиксель)

VSPACE=n - графикалық бейнеден тік (вертикаль) бағытта қалдырылатын бос кеңістік (пиксель)

ALT=”мәтін” - сурет шығарылмағанда көрсетілетін балама мәтін.

Басқа HTML-құжаттармен және Интернет мәліметтерімен гипербайла-ныс (гиперсілтеме) жасау командалары:

<А HREF="fail. htm"> . . . </А> немесе

<А HREF="http://www. kbtu. edu. kz"> . . . </А> - гиперсілтеме жасау.

<ADDRESS><A HREF=mailto: bb@kbtu. edu. kz> bb@kbtu. edu. kz </ADDRESS> - электрон-дық пошта адресімен гипербайланыс жасау

Кестелер

<TABLE> . . . </TABLE> - HTML-құжатқа кесте енгізу тегі, оның параметр-лері:

BGCOLOR=”GREEN” - фон түсі, ағылшынша сөзбен немесе он алтылық кодпен беріледі;

BORDER=n - жақтау (бордюр) сызығы ені, пиксельмен беріледі;

WIDHT=n - кесте ені, пиксельмен немесе пайызбен беріледі.

Кесте жасау тегтері

<CAPTION> . . . </CAPTION> - кесте тақырыбы, оның параметрі VALIGN=TOP - кесте алдындағы тақырып және VALIGN=BOTTOM - кесте соңындағы тақырып.

<TR> . . . </TR> - кесте жолы, яғни бір қатары. Мынадай параметрлері болуы мүмкін: BGCOLOR - жолдың ішкі фоны түсі; ALIGN=LEFT, RIGHT, CENTER - жол мәтіндерін көлденең туралау; VALIGN=TOP, BOTTOM, MIDDLE - жол мәтіндерін тік бағытта -вертикаль туралау.

<TD> . . . </TD> - кесте бағанасы. Оның параметрлері BGCOLOR - бағананың ішкі фоны түсі; ALIGN=LEFT, RIGHT, CENTER - бағана ішіндегі мәтінді көлденең туралау; VALIGN=TOP, BOTTOM, MIDDLE - бағана ішін-дегі мәтінді тік бағытта туралау; COLSPAN - бірнеше бағананы біріктіру, ROWSPAN - бірнеше жолды біріктіру.

<ТН> . . . </ТН> - бағана тақырыптары. Оның параметрлері BGCOLOR - осы бағананың ішкі фон түсі; ALIGN=LEFT, RIGHT, CENTER - көлденең тура-лау; VALIGN=TOP, BOTTOM, MIDDLE - вертикаль туралау; COLSPAN, ROWSPAN - бірнеше бағананы және жолдарды біріктіру; WIDHT - тақырып ені.

Фреймдер жасау тегтері

Фреймдер немесе кадрлар терезені бірнеше бөліктерге бөліп, олардың әрқайсысында жеке web-құжаттар орналастырады.

<FRAMESET> . . . </FRAMESET> - фрейм жасау тегтері. Оның параметрлері:

COLS - экранды бірнеше бағаналық (вертикаль) фреймдерге бөледі.

ROWS - экранды бірнеше қатар түріндегі (горизонталь) фрейм жолдарына бөледі.

BORDCOLOR - фреймнің жақтау сызығы түсі

ВОRDER - жақтау сызығы (бордюр) ені

FRAMEBORDER - жақтау шекарасы сызығы (FRAMEBORDER=YES - шека-ра сызығы бар, FRAMEBORDER=NO - шекара сызығы жоқ, FRAMESPACING=n - шекара сызығы ені)

<FRAME> - фреймді сипаттау тегі (<FRAME SRC='file. htm">) . Оның пара-метрлері:

SCROLING - жылжыту жолағын реттеу параметрі:

SCROLING=YES - жылжыту жолағы көрсетіледі

SCROLING=NO - жылжыту жолағы көрсетілмейді

SCROLING=AUTO - жылжыту жолағы қажет болғанда ғана көрсетіледі

MARGINWIDHT және MARGINHEIGHT - фрейм ішіндегі суреттерді ығысты-рып орналастыруға қажет параметрлер

NORESIZE - фрейм көлемінің өзгертілмейтінін көрсететін параметр.

<A HREF="file. htm" TARGET="frame2"> file. htm</A> - фреймдер арасында байланыс жасау

TARGET - фреймдер арасында байланыс жасау атрибуты, оның бірнеше мән-дері бар:

... жалғасы

Сіз бұл жұмысты біздің қосымшамыз арқылы толығымен тегін көре аласыз.