HTML-құжаттар қалай жасалынады?

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

HTML-тегтер

Барлық HTML тегтері "<" символынан басталып, ">" символына аяқталады. Бастау (стартовый) тегі және аяқтау (завершающий) тегі болады.

Мысал ретінде бастау тегі мен аяқтау тегінің арасына орналасқан, құжат тақырыбын сипаттайтын тақырып тегін келтірейік:

<TITLE> Құжат тақырыбы </TITLE>

Аяқтау тегі бастау тегіне ұқсас, айырмашылығы тек бұрышты жақша ішіндегі мәтін алдында слэштің ( /) болуында. Бұл мысалда <TITLE> тегі WEB-броузерге тақырып пішімінің (формат) қолданғанын, ал </TITLE> тегі мәтін тақырыбының аяқталғанын білдіреді.

Кейбір тегтер, мысалы, <P> (абзацты анықтайтын тег) аяқтау тегтерін қажет етпейді, бірақ оларды қолдану құжаттың бастапқы мәтінінің оқылуын жеңілдетіп, құрылымын жақсартады.

Кестелерді жасау

Кестелерді бейнелеу үшін HTML тегтерінің бірнеше түрі қолданылады:

§ TABLE тегтері – бүкіл кестенің спецификациясын қоршайды.

§ Міндетті емес элемент CAPTION – кестенің тақырыбын (атын)

спецификациялайды.

§ TR тегтері – кесте жолдарын спецификациялайды.

§ TH тегтері – жолдар мен бағандардың тақырыптарын спецификациялайды.

§ TD тегтері– кестедегі деректерді (кесте ұяшықтарының ішіндегісін) спецификациялайды.

Негізгі кестелік құрылымдар

Қарапайым мысалды: тақырыбы жоқ, 2 жол 2 бағаннан тұратын сандар кестесін (бірлік матрица) қарастырайық. Оның HTML коды мынандай болады:

<TABLE>

</TABLE>

және көбінесе броузерлер арқылы былайша көрсетіледі.

Кестенің қосымша қасиеттері. Мәтіндік ұяшықтары бар типтік кесте.

Жоғарыда көрсетілген кесте үлгісіне қосуға болатын бірнеше элементтер бар:

§ Кестенің тақырыбы (caption ) – кестенің өзімен байланысқан (кесте туралы

құжаттағы жолдар тексіне толықтауыш);

§ Тақырыпша (headers) (түсіндірме) – кесте жолдары мен бағаларына арналған;

§ Жақтау (рамка, borders) – кесте мен әр кесте ұяшығының айналасына арналған.

Сонымен қатар ALIGN мен VALIGN атрибуттары кестенің бейнелену сапасына әсер етеді. Олар құжаттың өрістеріне қатысты кестенің орналасуын айқындайды.

Мүмкін болатын мәндері: ALIGN=LEFT (сол жақпен туралау), ALIGN=CENTER (ортаға туралау), ALIGN=RIGHT (оң жаққа туралау).

WIDTH– Кестенің ені, пиксель арқылы WIDTH=400) немесе беттің енінің проценті түрінде (мысалы, WIDTH=80%) беріледі.

Жаттығу жұмыстары:

Жаттығу. Тексті пішімдеу (форматтау) тегтерін қолданып 1-суреттегідей HTML –құжат жасау.

1.Блокнот текстік редакторын ашып, бос құжатты Задание1.html деген атпен сақтаңыз.

2.Құжаттағы алғашқы тег <HTML> тегі болу керек. Бұл тег WEB-броузерге құжаттың HTML қолданылып жасағанын хабарлайды. Сондықтан құжаттыі бірінші жолына <HTML>деп теріңіз.

1-сурет. HTML құжат үлгісі

3.Терезенің тақырыбын енгізу үшін мына жолдарды теріңіз:

<HEAD>

Lt;TITLE> Пример работы

С тегами. Форматирование

</TITLE>
</HEAD>

4.Енді құжаттың денесін, яғни HTML құжатта не көрсетілетінін енгіземіз.Ол үшін мына жолдарды теріңіз:

<BODY BGCOLOR=yellow TEXT=blue >

мұндағы BGCOLOR=yellow құжаттың фоны – сары, ал TEXT=blue шығатын текстің түсі көк болатынын анықтайды.

5.Ары қарай тағы да теріңіз:

<H1>Это заголовок первого уровня</H1>

<H2>Это заголовок второго уровня</H2>

Бұл жолдар әр түрлі деңгейдегі тақырыптарды анықтайды.

6.Енді нөмірленген және нөмірленбеген тізім жасауды үйренейік. Ол үшін мына жолдарды енгізіңіз: