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

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

ЕСЕП БЕРУ
Тақырыбы: Html - де сайттың бірінші беті

Алматы 2020

Мазмұны
Кіріспе ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ...3
HTML тілінің негізгі түсініктері ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ...5
HTML тілінің атқаратын қызметі ... ... ... ... ... ... ... ... ... ... ... ... ... ... ...5
HTML тілінің түсініктеме сөздігі ... ... ... ... ... ... ... ... ... ... ... ... ... ... ..7
HTMLқұжатының құрылымы ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... 12
HTML тілі элементтері. Веб-сайт құру жолдары ... ... ... ... ... ... ... ...13
Құжаттың негізгі бөлігі ... ... ... ... ... ... ... . ... ... ... ... ... ... ... ... ... ... ... .13
Құжаттардағы түстерді анықтау ... ... ... ... ... ... ... ... ... ... ... ... ... ... ..15
HTML-құжатқа суреттер енгізу ... ... ... ... ... ... ... . ... ... ... ... ... ... ... ..16
HTML - де сайттың бірінші бетін құру жолы ... ... ... ... ... ... ... ... ... .18
Қорытынды ... ... ... ... ... ... .. ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... ... .21
Пайдаланылған әдебиеттер ... ... ... ... ... ... . ... ... ... ... ... ... ... ... ... ... ... ... 22

Кіріспе
Интернеттің бар мәліметтерінің, яғни барлық Web-құжаттарының бір ортақ қасиеті - олардың барлығы да HTML тілінде жазылған. HTML тілінде Web-құжаттарды жасау программалауға ұқсас болғанмен, ол қарапайым программалау тілі емес. HTML - гипермәтіндік белгілеу тілі. Ол кәдімгі мәтіндерді Web-парақтар түрінде бейнелеуге арналған ережелер жиынын анықтайды.
HTML гипертекстік тілін 1989 жылы World Wide Web гипертестік жүйесін бөлудің өңдеу технологиясының компоненттерінің бірі ретінде Тим Бернер Ли ұсынғаны белгілі.
Гипертексті бөлу негізіне құжаттың әрбір элементі тегтерімен қоршаған элементтердің жиынтығы түрінде көрсетуге болатын құжатты сипаттаудың тегтік моделі жататын болған. Өзінің мәні бойынша тегтер программалау тілдеріндегі BEGIN END жақша ұғымдарына жақын және локальды айнымалылардың HTML аттарының арасындағы амалдардың облысын білдіреді, құжаттағы тексттік элементтерді түсіндіру ережелерінің амалдарын анықтайды және т. б.
Өзімізге белгілі, интернет пайдаланушылары қарастыратын Web-сайт ақпаратты бет түрінде сақтайды. Әрбір осындай Web-бет HTML тілінде жазылған мәтіндік файл түрінде жазылуы тиіс. Броузер осы бетпен байланысқанда файлды негізге ала отырып бет түрін жасап шығарады.
Мұндай технология Web-беттердің мазмұнын пайдаланылып отырған броузердің типіне қарамастан өзгеріссіз бейнелеуге мүмкіндік береді.
Қазіргі кезеңде Web-құжаттарды құрудың көптеген программалық өнімдері бар. Олар HTML-файлдағы жолдық мәтіндерді теру қажеттілігінен арылтады. Бірақ біздің мақсатымызда кез келген Блокнот не WordPad мәтін редакторлардың болуы жеткілікті.
Сонымен, Web- беттерді дайындаудың стандартты процедурасының маңызы мынада: HTML-файлының мәтінін қолда бар кез келген мәтін редакторында теріп алып .html кеңейтілуімен сақтаймыз. Сонан соң файлды кез - келген Интернет - броузердің көмегімен ашып алып өзіміз құрған бетті тамашалаймыз.
HTML тілінің жалпы құрылымымен танысайық. Бұл тілде жазылған кез-келген құжат беттің мәтін жолдарынан және басқару символдары - тэгтерден тұрады. HTML-дің барлық тэгтеры міндетті түрде бұрыштық жақшаларға алынады. Ережеге сай бастапқы тэг және аяқтауыш тэгтер пайдаланылады.
Мысалы кез-келген HTML-құжаттың бастапқы, аяқтауыш тэгтері HTML және HTML жазылады. Көрініп тұрғандай, аяқтауыш тэг бастапқыдан слэштің () келуімен ерекшелінеді.

1. HTML тілінің негізгі түсініктері
1.1. HTML тілінің атқаратын қызметі
HTML-құжатарында белгілеу модельдерінің негізі ретінде тегтер моделі қабылдалынған. Тегтер моделі құжатты контейнерлер ретінде түсіндіріледі, мұндағы контейнерлердің әр қайсысы тегтермен басталып, тегтермен аяқталады. Яғни HTML құжаты кәдігімгі ASCII- файлға HTML басқару кодтары (тегтері) қосылған файл болып табылады.
HTML-құжатының тегтері көбінесе қолдануға және түсінуге жеңіл. Себебі олар ағылшын тілінің көпқолданбалы сөздерінен түсінікті түрде қысқартылып және белгіленіп алынған. HTML-тегі өзінің атынан, міндетті және міндетті емес атрибуттардан тұрады. Тег мәтіні бұрышты жақшалармен қоршалады. Мысал ретінде қарапайым варианттардың бірі: HEAD немесе i. Тегтердің күрделілігі олардың атрибуттарында болып табылады. Мұндағы атрибуттар тегтердің функцияларын өзгерту үшін қолданылады (көлемін, ұзындығын, түрін және т.б.).
Тегтер атрибуттары оның атынан кейін жазылады және бір-бірінен бір немесе бірнеше табуляция, пробел немесе жол басына қайтару символдары арқылы ажыратылады. HTML тілінде тегтер атрибуттарын кезекпен жазуды керек етпейді. Атрибуттың мәні атрибут атынан соң жазылатын теңдік белгісінен кейін жазылады. Егер атрибут мәні бір сөз немесе сан болып келетін болса, онда оны ешбір қосымша белгілеусіз теңдік белгісінен кейін жаза беруге болады. Басқа жағдайларда атрибут мәндерін бірлік немесе екілік тырнақшаларға алып жазу керек, әсіресе егер олар пробел арқылы бөлінген бірнеше сөз болса. Атрибут мәнінің ұзындығы 1024 символға дейін рұқсат етілген. Мысалға, әсіресе HREF атрибутының мәні ретінде басқа құжаттардың адресін (URL) көрсеткенде керекті регистрді қолдану маңызды болып табылады.
Көп жағдайларда HTML тегтері бастапқы және ақырлы компоненттерден тұрады және олардың арасына мәтін және басқа да құжат элементтері орналасады. Жабушы тегтің аты бастапқы тегтің атына сәйкес болып келеді, бірақ жабушы тегтің атының алдына көлденең сызықша () қойылады. Мысалы, шрифт түрі i-курсив тегі үшін жабушы сыңары i түрінде болады. Жабушы тегтер үшін атрибуттар ешқашанда қойылмайды, қойылса да ол атрибут қабылданбайды. Мәні бойынша тегтер әмбебап программалау тілдерінің "begin \ end" белгілеулеріне түсінігі бойынша өте ұқсас болып келеді. Тегтер құжаттың мәтіндік интерпретациялау шартының әрекет ету ауданын анықтайды.
Ішкі тегтерді қолданғанда құжатта ерекше ұқыптылықты сақтау керек. Ішкі тегтерді соңғысынан бастап бастапқысына қарай жазып шығу керек. Кейбір HTML тегінің жабушы тегтері болмайды, өйткені олар автономды элементтер болып табылады. Мысалы, бейнелер тегі IMG жабушы компонентті қажет етпейді. Автономды тегтерге тағы да BR- жолдарды айыру, HR-көлденең сызық және көрсетілетін нәтижеге әсер етпейтін, тек қана құжат туралы ақпараттар сақтайтын META және BASE сияқты тегтер жатады.
Кейбір жағдайларда жабушы тегтерді жазбаса да болады. Көптеген браузерлер құжат мәтінін өңдегенде бастапқы тегті алдыңғы тегтің жабушы тегі ретінде қабылдайды. Ең көп тараған мұндай тегтің түрі абзац тегі - P. өйткені оны құжаттарда жиі қолданады және оны әдетте әр абзац алдына жазады. Бір абзац біткеннен кейін келесі P тегі браузерге осы абзацты аяқтап жаңа абзац бастау керектігін көрсетеді.
Басқа бір жабушы тегтер түрі, жоқ болса да нәтижеге әсер етпейді және браузерлер оларсыз еш мүлтіксіз істей береді. Оларға мысал ретінде HTML тегін алуға болады. Сөйте тұрса да, әр жабушы тегтерді қойып отырған дұрыс. өйткені құжатты өңдеуден өткізгенде кейбір жаңылулар мен қателер болуы мүмкін.
HTML тілінің атқаратын қызметі.
Web-парақтар экранда ықшам түрде безендіріліп көрсетілгенмен, HTML тілі мәтіндерді пішімдеп (форматтап) көрсететін тілге жатпайды. Өйткені әрбір тұтынушы әр түрлі компьютерлерді пайдаланады. Сол себепті жаңа ғана зауыттан шыққан бір компьютердің Wіndows жүйесінде жұмыс істей алатын броузері бар болса, екінші бір тұтынушы компьютері тек MS DOS жүйесінде жұмыс істейтін ескі броузерді пайдалануы мүмкін. Бұл екеуінің көрсету мүмкіндіктері әр түрлі болғандықтан, бір файл екеуіне екі түрлі болып көрсетіледі.
Құжаттарды әрбір тұтынушының әр түрлі құрылғыларда және әр түрлі броузер программалармен көретіндіктерін ескерсек, HTML тілін мәтіндерді пішімдеу (форматтау) тәсілдерін жазуға арналған тіл деп айтуға болмайды. Ол Интернеттегі мәтін бөліктерінің атқаратын қызметін анықтап, соларды әрбір тұтынушыға бейімдеп жеткізе алатын құжатты функционалды түрде белгілейтін тіл болып табылады.
Мысалы, егер мәтін тақырыбын бейнелеу керек болса, онда HTML коды оны тақырып ретінде көрсетуге тырысады. Тақырыптың белгілеу коды алынған соң, оны броузер-программа өз мүмкіндігін пайдаланып, оны үлкейтіп ірі әріптермен жазуы ықтимал немесе тек экран жолдарының ортасына жылжытып қана көрсетуіне де болады. Ал егер бұл құжат мәтіні дыбыс синтезаторы арқылы берілетін болса, онда тақырып қаттырақ шығатын дауыс арқылы айтылып, одан соң аздап үзіліс жасалуы да мүмкін.
HTML тілінде мәтінді форматтау тәсілдерінің көптеген мүмкіндіктері бар, бірақ жалпы тұрғыдан алғанда құжаттың маәтіні мен оны безендіріп көрсету жолдарының айырмашылығы сақталып отырады. Мысалы, HTML тілінің соңғы [HTML 4.0] нұсқасында мәтінді форматтау командаларын пайдалану ұсынылмаған.

1.2. HTML тілінің түсініктеме сөздігі
Web-құжат (HTML-құжат) - гипермәтінді белгілеу тілінде HTML және HTML тәгтері арасында орналасады.
Тәг (tag) - HTML тілінің кодтары, яғни мәтіндерді форматтайтын командалары. Кодтар - бұрыштық жақшаларға алынып жазылған ағылшын тілінің толық немесе қысқартылған сөз тіркестері.
Web-сайт, Web-сервер - бір-бірімен логикалық түрде байланысып, HTML тілінде жазылған құжаттар тізбегі.
Құжатты белгілеуге арналған HTML тәгтері қызметтері.
Негізгі тәгтер
HEAD ... HEAD - бұлардың ортасында құжат туралы мәлімет орналасады және TITLE тәгі тұруы мүмкін. TITLE ... TITLE - бұлар броузер-программа маңдайшасында жазылатын терезе тақырыбын қоршап тұрады.
BODY ... BODY - бұл екеуінің аралығында құжат "тұлғасы" (мәтін, графика, т.с.с.) жайғасады.
BОDY тәгінің параметрлері (атрибуттары):
BGCOLOR - фон түсі (BODY BGCOLOR ="#FFFFFF");
BACKGROUND - фон орнына "түсқағаз" (обои) түрінде сурет беру (BODY BACKGROUND ="BERKUT.JPG");
TEXT - мәтін түсі (BODY TEXT ="#00FF00");
LINK - гипермәтіндік сілтеме (байланыс) түсі;
VLINK - алдында қаралған сілтеме түсі;
ALINK - осы сәттегі екпінді сілтеме (курсор меңзеп тұрған) түсі.
Мәтіндерді форматтау тәгтері.
Р ... Р - абзацты белгілейтін тәгтер. Жаңа абзац алдыңғысынан бос жолмен бөлініп тұрады.
BR - мәтінді келесі жолға көшіретін жалқы тәг. Графиканы, суретті мәтіннен бөліп тұру үшін де қолданылуы мүмкін.
HR - мәтіндерді бір-бірінен логикалық түрде бөліп тұратын көлденең сызық жүргізетін жалқы тәг.
PRE ... PRE - бұлардың ортасында алдын ала форматталған мәтін орналасады. Ондай мәтін экранға "курьер" (Courier New) қарпімен шығарылады.
Мәтін логикалық бөліктерін (тақырыптарын) ерекшелеу тәгтері:
Н1 ... Н1 - бірінші деңгей тақырыбы (ең ірісі).
Н2 ... Н2 - екінші деңгей тақырыбы. ...
Н6 ... Н6 - алтыншы деңгей тақырыбы (ең кішісі).
Туралау параметрлері.
Р және Н* тәгтерінде қолданылады, олардың мәндері:
ALIGN=LEFT - сол жақ шетке жақындатып туралау;
ALIGN=RIGHT - оң жақ шетке жақындатып туралау;
ALIGN=CENTER - ортаға жылжытып туралау.
Туралау тәгтері.
LEFT ... LEFT - сол жақ шетке туралау;
RIGHT ... RIGHT - оң жақ шетке туралау;
CENTER ... CENTER - ортаға жылжытып туралау.
Мәтін бөліктерін ерекшелеу тәгтері.
В ... В - мәтінді (сөздерді, әріптерді) қалыңдатылған қаріппен ерекшелейді.
I ... I - мәтінді қисайтылған курсив қаріппен (Italic) ерекшелейді.
U ... U - аралығындағы мәтіннің астын сызады.
BLINK ... BLINK - аралығындағы мәтін жыпылықтап назар аудартып тұрады.
FONT SIZE=+n ... FONT
FONT SIZE= - n ... FONT - қаріп көлемін өзгертетін тәгтер.
FONT COLOR="#OOOOFF ... FONT қаріп түсін өзгертетін тәгтер.
Сырғымалы жолдар тәгтері
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="#FFFFFFF" - сырғымалы жол аумағын басқа түске бояу, түс ағылшынша атымен немесе он алтылық кодымен көрсетіледі;
HEIGHT=n - сырғымалы жол биіктігін пиксельмен (n) көрсету;
FONT SIZE=nMARQUEE...мәтін...MARQUE EFONT - сырғымалы жол мәтінінің қаріп мөлшерін, типін, түсін әдеттегідей өзгертуге болады.
Тізім жасайтын тәгтер
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" ... А - гиперсілтеме жасау.
ADDRESSA 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.htmA - фреймдер арасында байланыс жасау
TARGET - фреймдер арасында байланыс жасау атрибуты, оның бірнеше мәндері бар:
_BLANK - сілтеме көрсетіп тұрған парақты жаңа бос терезеге жүктеу;
_SELF - сілтеме көрсетіп тұрған парақты сол сілтеме тұрған терезеге жүктеу;
_PARENT - сілтеме көрсетіп тұрған парақты фреймдерді ашып тұрған негізгі терезеге жүктеу;
_ТОР - сілтеме көрсетіп тұрған парақты фреймдер құрылымы біріктірілген толық терезеге жүктеу.
Фреймдерді көрсету қабілеті жоқ броузерлер үшін:
FRAMESET
...Мұнда фреймдер орналасады...
FRAMESEТ
NOFRAMES
BODY ...Мұнда фреймсіз мәтін орналасады...
BODY
NOFRAMES
Фреймдерді көре алмайтын тұтынушылар үшін арнайы тәг ішіне түсініктеме мәтін беріледі.

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

... жалғасы

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