Html-дің қызметті. Html-дің қысқаша тарихы. Html құжаттың құрылымы. Html элементтері.
HTML-құжат – бұл кәдімгі мәтін файлы, сондықтан поэтому для создания WEB-бетін жасау үшін кәдімгі мәтін редакторы жеткілікті, мысалы БЛОКНОТ мәтін редакторы. Мәтін мен басқа объектілердің форматталуын басқару үшін терілетін мәтінге барлығының қай түрде болатынын анықтайтын, тегтер немесе дескрипторлар деп аталатын, арнайы кодтар енгізіледі. Мысалы, егер бетте қалың қаріп керек болса, онда бұл мәтін қалың қаріпке сәйкес тегтерге алынады.
Мысал. <B> Салем </B>
<B> бірінші тегі браузерге пайдаланылатын мәтінді қалың қаріппен жазу керектігін хабарлайды. Бұл </B> кездеспегенше дейін жалғасады. Қиғаш сызық жабушы тегті белгілейді.
WEB-бетін HTML құжаттарының арнайы редакторлар көмегімен жасауға болады, бірақ WEB-беттерін жасаудың автоматтау құралдарының барлығы аяғында тегтері бар, HTML-құжаттарын жасайтынын ұмытпаған жөн. Одан басқа WEB-беттерін профессионалды жасау үшін сіз олардың ішкі құрылымын, яғни HTML кодтарын білуіңіз қажет.
HTML-файлдары әрқашан браузерге оның HTML-кодтары бар файлмен жұмыс істейтінін хабарлайтын <HTML> тегінен басталады. HTML-файлының соңғы жолы әрқашан “соңы” дегенді білдіретін </HTML> тегінен тұрады. HTML құжаты: басы мен денесі деген екі бөліктен тұрады. Басын анықтау үшін бірден <HTML> тегінен кейін <HEAD> мен </HEAD> тегтері қолданылады. Денесін анықтау үшін бірден </HEAD> тегінен кейін <BODY> мен </BODY> тегтері орналастырылады.
Осылайша, бастапқы мәтіннің белгіленуі іске асатын HTML кодтары тегтер деп аталады. Тегтер (<) символымен басталып (>) символымен аяқталады. Бұл символдардың арасында тегті анықтайтын басты сөз орналасады. Тег атауындағы әріп регистрі мәнсіз. Көп жағдайларда қос: ашушы мен жабушы тегтер пайдаланылады. Ашушы тег эффект әсерін жасаса, ал жабушы тег оны тоқтатады. Жабушы тегтерінде (/) символы болады.
Мысалы, БЛОКНОТ редакторын ашып келесі мәтінді теріңіз.
<HTML>
<HEAD></HEAD>
<BODY>
Мұнда WEB-бетінің мәтіні орналастырылады
</BODY>
</HTML>
Файлды html немесе htm кеңейтілуімен сақтаңыз. Егер осы файлды іске қосса, Internet Explorer шолушысы ашылады да, ал онда сіз өзіңіздің HTML құжатыңызды көресіз. Оған қоса тегтер экранда көрсетілмейді.
Басында шолушы терезесінің басында көрсетілетін WEB-бетінің атауын енгізуге болады. Ол үшін <TITLE> мен </TITLE> қос тегтері пайдаланады..
Мысалы.
<HTML>
<HEAD><TITLE>Жай Web-бет</TITLE>
</HEAD>
<BODY>
Мұнда WEB-бетінің мәтіні орналастырылады
</BODY>
</HTML>
Бет денесінде орналасатын мәтіннің қалай жасалатынын қарастырайық. Біріншіден, егер кәдімгі мәтінде жаңа жолға көшу үшін Enter пернесін басуға болса, ал HTML-құжатында <BR> тегін қолдану керек, өйткені браузер Enter пернесін елемейді.
Екіншіден, HTML тілінде <!-- арнайы тегімен басталатын түсініктемелерді қолдануға болады. Бұл тегтен кейінгі мәтін экранда бейнеленбейді. Түсініктеме --> тегімен аяқталады. Онда (>) символдары мен басқа тегтер болмауы керек.
Ашушы тегтерде тегпен жасалатын эффектіге әсер ететін атрибуттар болуы мүмкін. Атрибуттар – бұл басты сөзден бос аралықтармен ажыратылған қосымша басты сөздер. Атрибуттар мәндері басты сөзден теңдік белгісімен ажыратылады. Атрибут мәні тырнақшаға алынады. Жабушы тегтердің атрибуттары болмайды. BODY тегінің бет фонының түсін беретін BGCOLOR атрибутының мысалы:
<BODY BGCOLOR = “#0000FF”>
Осылайша, қарапайым WEB-бетінің құрылымы келесі:
<HTML>
<HEAD><TITLE> Жай құжат </TITLE>
</HEAD>
<BODY>
Бұл мәтінді экраннан оқуға болады
<BR> Жаңа жол. <BR> Екінші жол.
Жол жалғасы.
</BODY>
</HTML>
WEB-бетінің сыртқы түрі 1.1 суретінде көрсетілген.
WEB-бетінің сыртқы түрі
Құжаттың негізгі функционалды бөлімдері тақырыптар мен абзацтар болып табылады.
HTML тілінде құжаттың ішкі тақырыптарының 6 деңгейі бар. Олар <H1> мен </H1> ден бастап <H6> мен </H6> дейінгі тегтермен белгіленеді. Экранда бұл тақырыптар жартылай қалың әр түрлі мәнді қаріптермен бейнеледі.
Абзацтерді белгілеу үшін <P> мен </P> тегтері пайдаланады. HTML тілінде бас жол жасау құралдары қарастырылмағандықтан браузер абзацтар арасында әдетте бос жол енгізеді.
Мәтінде ажыратудың маңызды құралы <HR> тегімен жасалатын горизонталды сызық болып табылады.. Бұл жалғыз тег және оның жабушы тегі > жоқ. Сызық ұзындығын экран еніне байланысты Width атрибуты арқылы беруге болады.
Мысалы. <HR Width =50%>
Сызық тегістелуін сол жақ, центр, оң жақ бойынша Align атрибутының көмегімен беруге болады. Мысалы, Align=center.
Сызық қалыңдығын беру үшін Size атрибуты қолданылады. Қалыңдық пиксельдермен беріледі.
Сөздер арасындағы барлық "артық" бос аралықтар мен жаңа жолға Enter пернесі арқылы көшулер HTML құжатында елемелінетінін еске сақтау керек. Абзац жасаусыз жаңа жолға көшу үшін <BR> тегі қолданылады.
Сөз тіркесін қалың қаріппен ерекшелеу үшін <B> мен </B> тегтері қызмет етеді.
Курсивпен ерекшелеу үшін <I> мен </I> тегтері қызмет етеді.
Астын сызу үшін <U> мен </U> тегтері қызмет етеді.
Астыңғы индекс жазу үшін <SUB> пен </SUB> тегтері қызмет етеді.
Үстіңгі индекс жазу үшін <SUP> пен </SUP> тегтері қызмет етеді.
Мысалы.
Судың химиялық формуласы H<SUB>2</SUB>O.
Экранда осылайша көрінеді: Судың химиялық формуласы Н2О.
Мәтінге пернетақта өзінен тікелей енгізіле алмайтын символдар арнайы деп аталады. Ондай символдар үшін ерекше тегтер бар.
Төрт символдың - <, > белгілері, амперсанд & пен тырнақшалар “ HTML құжатында арнайы мәні бар, сондықтан олар мәтінде өзінің кәдімгі мәнінде қолданыла алмайды. Осы символдардың біреуін қолдану үшін келесі escape-тізбектерінің біреуін пайдалану керек:
&it – кіші белгісі; > – үлкен белгісі; & – амперсанд; " - тырнақша.