HTML-құжаттарды кез келген текстік редактор немесе арнайы HTML-редакторлар мен конвертерлер арқылы жасауға болады. Біз Блокнот текстік редакторында жасап үйренеміз.
HTML-тегтер
Барлық HTML тегтері "<" символынан басталып, ">" символына аяқталады. Бастау (стартовый) тегі және аяқтау (завершающий) тегі болады.
Мысал ретінде бастау тегі мен аяқтау тегінің арасына орналасқан, құжат тақырыбын сипаттайтын тақырып тегін келтірейік:
| <TITLE> Құжат тақырыбы </TITLE> |
Аяқтау тегі бастау тегіне ұқсас, айырмашылығы тек бұрышты жақша ішіндегі мәтін алдында слэштің (/) болуында. Бұл мысалда <TITLE> тегі WEB-броузерге тақырып пішімінің (формат) қолданғанын, ал </TITLE> тегі мәтін тақырыбының аяқталғанын білдіреді.
Кейбір тегтер, мысалы, <P> (абзацты анықтайтын тег) аяқтау тегтерін қажет етпейді, бірақ оларды қолдану құжаттың бастапқы мәтінінің оқылуын жеңілдетіп, құрылымын жақсартады.
Кестелерді жасау
Кестелерді бейнелеу үшін HTML тегтерінің бірнеше түрі қолданылады:
§ TABLE тегтері – бүкіл кестенің спецификациясын қоршайды.
§ Міндетті емес элемент CAPTION – кестенің тақырыбын (атын)
спецификациялайды.
§ TR тегтері – кесте жолдарын спецификациялайды.
§ TH тегтері – жолдар мен бағандардың тақырыптарын спецификациялайды.
§ TD тегтері– кестедегі деректерді (кесте ұяшықтарының ішіндегісін) спецификациялайды.
Негізгі кестелік құрылымдар
Қарапайым мысалды: тақырыбы жоқ, 2 жол 2 бағаннан тұратын сандар кестесін (бірлік матрица) қарастырайық. Оның HTML коды мынандай болады:
<TABLE>
<TR> <TD> 1 </TD> <TD> 0 </TD> </TR>
<TR> <TD> 0 </TD> <TD> 1 </TD> </TR>
</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.Енді нөмірленген және нөмірленбеген тізім жасауды үйренейік. Ол үшін мына жолдарды енгізіңіз:
