Құжат атауы



бет1/4
Дата31.01.2022
өлшемі34.48 Kb.
#454980
  1   2   3   4
Html тілін о ыту бойынша зертханалы тапсырмалар дайындау

HTML тілін оқыту бойынша зертханалық тапсырмалар дайындау



Зертханалық жұмыс №1

Тақырыбы: HTML тілінде қарапайым web-парақ құру

Жұмыс мақсаты: HTML тілінде қарапайым Web-беттерді құрып үйрену.

Қысқаша теориялық мағлұматтар:



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

Web-бет – экранда браузер арқылы көруге болатын мәтіні кірістірілген және дискіде жеке файл түрінде сақталатын, сонымен қатар қосымша жеке файлдарда сақталынатын мультимедия-иллюстрациялы (суреттер, видео, аудио және т.б.) сілтемелері бар ерекше құжат.

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

Web-бет ... тегтерінде орналасып, екі бөліктен тұрады: атауы және браузерде бейнеленетін мазмұны.

Парақ тақырыбы ... тегтерінде орналасады. Тақырып құрамына ... тегтерінде орналасатын және браузер терезесінің жоғарғы жолында бейнеленетін беттің тақырыбы кіреді.

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

Браузерде бейнелетін беттің мазмұны ...

Құжат денесі

ак.gif"> - HTML- құжаты мысалында фон ретінде "bак.gif” кішкентай графикалық бейнесі пайдаланылатын болады.



  • backcolor =#ffffff (yellow)– фонның түсін анықтайды (сары).

  • text = #0000ff (blue) мәтін түсін анықтайды (көк).

  • Bgcolor – құжат мәтінінің түсін анықтайды. Парақша айналасының түсі өзгеруі мүмкін болғандықтан, мәтіннің сәйкес түсін таңдай білу қажет. Ол үшін келесі атрибуттар қолданылады:

    • text - құжат мәтінінің түсін анықтайды;

    • link - гипермәтіндік сілтеме бойынша өту жүзеге асырылатын мәтіннің белгіленген элементін басқан кездегі түсін анықтайды;

    • vlink - бұрын қаралған құжат сілтемесінің түсін анықтайды;

    • alink - тышқан курсоры бағытталып, оның оң жақ батырмасы басылған кездегі сілтеме түсін анықтайды, яғни тура сілтемеге өтер уақыт алдында.

    Ескерту: HTML тіліндегі код Блокнот мәтіндік редакторында теріліп, *.html кеңейтпесімен сақталуы керек. Сонда ол файл веб-бет түрінде сақталады. Оны кез-келген браузермен көруге болады (Internet Explorer, Opera, Mozilla Firefox және т.б.).

    Зертханалық жұмыс №2

    Тақырыбы: Мәтінді форматтаудың негізгі элементтері.

    Жұмыстың мақсаты: HTML тілінде жолды ауыстыру, абзацтарды түзету мен көлденең жолақтарды жасап үйрену.

    Қысқаша теориялық мағлұматтар:

    НTML-де мәтінді форматтаудың негізгі элементтеріне келесілер жатады:

    • ,
      жолдарды ажыратады, сонымен қатар абзацты ерекшелеп көрсететін бос жолды қосады (абзац тегі). Оның негізгі атрибуттары:



    - align, left, center, right, justify шегіністерін білдіреді (
    Абзац мәтіні

    );

    - style – мәтін стилі (



    • – жолды ауыстыру үшін пайдаланылады (жолды үзіп, жаңа жолға көшу тегі). Сlear атрибуты =


      тегінде сіз белгілеген нүктеде объектіні мәтінмен қоршалуын тоқтату үшін және мәтінді объектінің сыртындағы бос жерде жалғастыру үшін пайдаланылады. Объектіден кейін жалғасатын мәтін clear = атрибутының left, right немесе all мәндерімен түзеледі:


    • - мәтін жақын сол жақ бұрыштан бастап жалғастырылатын болады.


    • мәтін жақын оң жақ бұрыштан бастап жалғастырылатын болады.


    • - сол жақ та, оу жақ та аудандар босаған уақытта мәтін жалғастырылатын болады.

    • - (No Break, жолды үзбеу) браузерге мәтінді бір жолда, оны тоқтатпай бейнелеуге бұйрық береді

    • ,
      - қазіргі заманғы беттң құруда беттің html кодының блоктарына арналған ыңғайлы контейнер ретінде пайдаланылады, оны динамикалық тұрғыда басқару оңай – ауыстыру, шегіністерді реттеу, жасыру және т.б. (
      элементіне ұқсас). Оның кіріктірілген атрибуты бар:

    • align, left, center, right, justify шегіністерін бағыттайды (
      Бөлім мәтіні
      ).


    • - көлденең сызықты (жолақты) құру үшін пайдаланылады. Егер сызық барлық жолға емес, оның қандай да бір бөлігіне, мысалы, 40% бөлігіне құру керек болса, онда команда былай беріледі:

    = 40%>. Кең сызықты құру үшін оның енін белгілеу керек. (қалып бойынша – пиксельдермен беріледі):
    . Оның келесідей атрибуттары бар:

    • align - түзету (мәндері - left, center, right);

    • color – жолақ түсі;

    • size – пиксель бойынша биіктігі;

    • width – экранның енінен пиксель бойынша немесе пайыз бойынша ені;

    • noshade - «жазық» жолақшаны шығару (себебі қалып бойынша браузер жолақтарды «көлемді» етіп салады).




    Зертханалық жұмыс №3

    Тақырыбы: Түстерді және мәтіндерді форматтаудың кейбір элементтерін аықтау.

    Жұмыстың мақсаты: Мәтінді форматтаусыз бейнелеуді, әр түрлі стильлерді белгілеп үйренуді, яғни НТМL тілінде мәтін өлшемі мен түсін басқаруды үйрену.

    Қысқаша теориялық мағлұматтар:

    Мәтінді форматтаудың кейбір элементтері:


    • ... - ақпарат бөлігін ерекшелеу және оған әр түрлі стиль беру .шін пайдаланылады.

    мәтін >

    SPAN элементінің көмегімен мәтіндегі әрбір әріпке әр түрлі стиль қолдануға болады (түс, өлшем, және т.б.) Атрибуттары:



    • title – пайда болатын көмек (всплывающая подсказка);

    • unselectable – аталған элементте мәтінді ерекшелеуге мүмкіндік береді немесе бермейді (on – мүмкіндік береді, off – мүмкіндік бермейді);

    • style – мәтін стилі ( font-size: 20pt; font-style: italic; color: red).

    Мәтін
    • - тег мәтінді форматтаусыз бейнелеуге мүмкіндік береді.


    мен
    тэгтерінде берілген бүкіл мәтін сіз тергендей дәлдікте бейнеленетін болады, сонымен қатар мәтін моноендік (моноширинный) қаріппен берілетін болады, ол мәтінді бағандарға реттеу мәселесін жеңілдетеді. Элемент барлық браузерлерде жұмыс істемейді, ол width атрибутына ие болуы мүмкін. Бұл атрибут мәтінге берілетін бос кеңістіктіке енді белгілейді.




    символдар саны >...мәтін...


    • - тег негізгі мәтіннен цитаталарды ерекшелеу үшін пайдаланалынады. Ол контейнер болып табылады және форматтаудың кез келген тегтерінен тұруы мүмкін.
      - белгілі бір атрибуттарды көрсеткен жағдайда мәтіннің сол және оң жағынан өрістерді қосады. Атрибуттары (n –пиксельдер саны):

    • leftmargin=n –барлық бет үшін сол жақ өрісті анықтайды;

    • topmargin=n - жоғарғы өрісті анықтайды.

    Мәтін


    - құжат авторының идентификациясы мен автор адресін көрсету үшін қолданылады. Осында авторлық құқықтар туралы мәліметтер енгізіледі. Бұл элемент құжаттың не басында, не аяғында орналасады. Бұл элементте жиі құжаттың құрылуы және жаңалану күні көрсетіледі. Бұл оқырмандарға өздері қарастырып жатқан нұсқаны бұрындары қарастырған-қарастырмағанын білуге көмектеседі. Осы тэгтердің арасында орналасқан мәтін әдетте браузермен курсив түрінде көрсетіледі.

    < ADDRESS>байланыс ақпараты

    Құжаттағы түстерді анықтау

    Түсті анықтау үшін қажетті атрибутты пайдаланғаннан кейін не түс атауын (тырнақша ішінде), не оның он алты сандық мәнін қою керек. Түсті он алты сандық санмен белгілеу үшін ол түсті үш құраушыға бөліп белгілеуге болады: қызыл (R), жасыл (G), көк (B); оның әрқайсысы 0-ден бастап FF-ке дейінгі мәнге ие.

    RGB форматындағы түсті жазу мысалдары кестеде берілген:


    Аталған түстерден басқа қосымша түстер де бар. Олардың барлық саны 216 түс. Түсті белгілеу үшін аталған терминдердің орнына RGB- кодтарын пайданалануға болады, мысалы: # FF0000 – кызыл. RGB- кодтарды ауыстыра отырып, мәтін мен фонның қажетті түстерін таңдап алуға болады. RGB-кодары бар барлық түстер 1.3.1-суретте берілген
    Зертханалық жұмыс №4

    Тақырыбы: Мәтінді форматтау.

    Жұмыстың мақсаты: HTML тілінде физикалық және логикалық стильдердің элементтерін пайдалана отырып, мәтінді форматтауды үйрену.

    Қысқаша теориялық мағлұматтар:



      1. Мәтін үзінділерін физикалық стиль элементтерімен безендіру.

    Мәтіннің жеке бөліктерін ерекшелеу үшін келесі физикалық стильдерді пайдалануға болады:
  •   1   2   3   4




    ©dereksiz.org 2024
    әкімшілігінің қараңыз

        Басты бет