Практикалық жұмыс. Тізімдерді құру. Сырғымылы жолдарды ұйымдастыру

Предпросмотр материала:

Практикалық  жұмыс

Тізімдерді құру. Сырғымылы жолдарды ұйымдастыру

 

Мақсаты:  HTML-құжатында тізім жасауды және сырғымалы жолдарды ұйымдастыру үлгілерін үйрену.

Сабақ  жоспары: Нөмірленген, маркерленген тізімдерге  және сырғымалы жолдарға берілген жаттығуларды орындай отырып, оқушыларды өз бетінше жұмыс жасауға қалыптастыру.

 

HTML-тізімін қолдану. Тізімдер. Тізімдер анықтамасы.

Тізімдердің (lіsts) НТМL тіліне енгізілуінің басты себебі – мәтіндік редакторлардың тізімдермен жұмыс істеу мүмкіндіктерінің мол болуы әсерінен деп айтуға болады. Тізім құрғанда оның жолдарын нөмірлеу немесе белгілеуді біртіндеп орындау қажет етілмей, бұл жұмысты программа өз міндетіне алады. Егер тізім жаңа жолмен толықтырылатын немесе оның бірі қысқартылатын болса, онда  нөмірлеу реттілігі де автоматты түрде түзетіледі. Тізім нөмірленбей, тек белгіленетін кездерде әрбір жол алдына маркерлеу белгілері: сызықшалар, дөңгелекшелер, тіктөртбұрыштылар, ромбылар және де басқа да таңбалар қойылады. Осының нәтижесінде тізім оқуға ыңғайлы түрдегі «фирмалық» сипатқа ие болады.

Тізім жасау үшін қолданылатын тэгтерді шартты түрде екі топқа бөлуге болады: олардың біріншісі – тізімнің жалпы көрінісін анықтайтын атрибуттық сыртқы белгілер, ал екіншісі – оның құрылымын қалыптастыратын ішкі белгілер. Соңғы ішкі белгілер үшін тек бір ғана ашылу тэгі қолданылады.

Нөмірленген тізімдер

Нөмірленген тізімдер алды­на нөмір қойылады. <ОL> және </ОL> сыртқы тэгтерінің арасында орналасқан мәтін жолдары белгіленген тізім ретінде қабылданады. Мұнда әрбір белгіленетін мәтін жолын <LІ> ішкі тэгімен бастап отыру керек.

<OL> 
<LI>Иван; 
<LI>Данила; 
<LI>Игорь
</OL>

Тізім мына түрде көрсетіледі:

  1. Иван;
  2. Данила;
  3. Игорь

 

3 жаттығу. Сырғымалы жолдарды ұйымдастыруда тегтер мен параметрлерді пайдалану.

<HTML><HEAD>

<TITLE>Мысал</TITLE></HEAD>

<BODY text=red>

<CENTER>

<H2> Cырғымалы жолдар мысалдары </H2> <HR>

<H3> <MARQUEE BGCOLOR=”BLUE”

 BEHAVIOR= “SCROLL”

 DIRECTION=”RIGHT” HEIGHT=30> Бұл алғашқы сырғымалы жол

</MARQUEE></H3>

<P> <MARQUEE BGCOLOR=”Green” HEIGHT=30

 WIDTH=''90%''>Бұл екінші сырғымалы жол

         </MARQUEE>

<P> <MARQUEE BGCOLOR=”Green” BENAVIOR=”ALTERNATE”>

 DIRECTION=”LEFT” HEIGHT=30> Бұл үшінші сырғымалы жол </MARQUEE>   

 <HR>

</CENTER></BODY>

</HTML>   

                                                

 

Тапсырмалар:

1. Нөмерленген тізімді қолданып, Қазақстанның облыстарын, қалаларының тізімін шығарыңыз.

2. Маркерленген тізімді қолданып, пәндер тізімін шығарыңыз.

 

 

 

 

 

 

 

1 жаттығу. Номер бойынша өз сыныбыңдағы оқушылардың тізімін жазып шығыңыз.

Мысалы:

 

<OL>

<LI> Айжан

<LI> Арман 

<LI> Алмас

<LI> Марат

</OL>

 

2 жаттығу.  Маркерленген кабинеттер тізімін шығарыңыз

Мысалы:

<UL>

<LI> Информатика кабинеті

<LI> Физика кабинеті

<LI> Химия кабинеті

<LI> Тарих кабинеті

</UL>

 

Маркерленген тізімдер.

Тізім тэгтерінің ең қарапайым түрі – нөмірленбеген белгілеу тізімі <UL> (unordered lіst). Нөмірленбеген тізімдер: <UL> ... </UL> Мұнда әрбір белгіленетін мәтін жолын <LІ> ішкі тэгімен бастап отыру керек.

    Мысалы мынадай тізім құру керек болса:

 

<UL> 
<LI>Иван; 
<LI>Данила; 
<LI>Игорь

</UL>

  • Иван;
  • Данила;
  • Игорь
 

 

Нөмірленген тізімнің әрбір жолы реттелген тәртіп бойынша араб немесе рим сандарымен, әйтпесе латын алфавитінің әріптерімен таңбаланады. Ол таңбаларды өзгерту type= “…” атрибутымен көрсетіледі.

Нөмірлеу таңбаларын анықтайтын type атрибутының мүмкін мәндері кестеде көрсетілген.

Атрибут мәні

Нөмірлену таңбалары

A -

Үлкен латын әріптері (А, В, С, D, ...)

a -

Кіші латын әріптері (а, b, с, d, ...)

I -

Үлкен рим цифрлері (І, ІІ, ІІІ, ІV,…)

i -

Кіші рим цифрлері (і, іі, ііі, іv, ...)

1 -

Кәдімгі цифрлер (1, 2, 3, 4,...)

START - параметрі санақ қай саннан басталатынын анықтайды.

Келесі мысалда тізім үлкен рим санының сегізінші цифрінен басталып нөмерленген:

<OL TYPE="I" START="8">
<LI> Сегіз
<LI> Тоғыз
<LI> Он
<LI> Он бір
<LI> Он екі
</OL>

  1. Сегіз
  2. Тоғыз
  3. Он
  4. Он бір
  5. Он екі

 

 

<UL>параметрлерінің тэгі

Маркерленген тізім тэгі:
Нөмірленбеген тізім үшін әдетте тізімдегі элементті белгілеуге маркерді қолданады. Ал маркердің түрін, заң бойынша, қолданушы таңдайды.
<UL> тэгі өзіне TYPE және COMPACT. параметрін қоса алады. Оның disc, circle, square деген белгілері бар.

Атрибут

Атқаратын қызметі

<UL TYPE=disc><LI> disc </UL>

·         disc

<UL TYPE=circle><LI> circle </UL>

o   circle

<UL TYPE=square><LI> square </UL>

§  square

Бұл белгілер маркердің түрін береді. Жазбаған жағдайда автоматты түрде disc жазылады.

Анықтамалар тізімі:

Анықтамалары бар тізімдер <DL> (defіnіtіon lіsts) жоғарыдағылардан өзгешелеу тәсілмен  жасалады. Мұнда <LІ> тэгі орнына <DT> (defіnіtіon term — анықталатын термин) термин тэгі және оған қосымша <DD> (defіnіtіon defіnіtіon — анықтаманы анықтау) терминді түсіндіру белгісі жазылады.

Мұндағы <DT> және <DD> тэгтері <LІ> тәрізді жабылмай, жалқы түрде жазылады. Егер анықталатын термин түсінігі бір жолға сиятындай қысқа болса, онда <DL COMPACT>сыртқы тэгін қолдануға болады.
Анықтамалар тізімі былай жазылады:

<DL>
<DT> Термин
<DD> Терминге анықтама
<DD> Терминге анықтама
<DD> Терминге анықтама
<DD> Терминге анықтама
</DL>

Термин

Терминге анықтама

Терминге анықтама

Терминге анықтама

            Терминге анықтама

DL элементімен бірге COMPACT атрибутын қолдануға болады, сол кезде тізімнің пункттары жинақы орналасады. <DL COMPACT> Бұл атрибут тура осылай қолданылады, ешқандай да сан қойылмайды.

Мысал 2.

<html>

<head>

          <title>

                Мысал 2

          </title>

     </head>

<body bgcolor="#FFFFFF" TEXT="black" LINK="#00FF00" ALINK="#00FF00" VLINK="blue">

<OL TYPE="1">

<Font size="6"> <b>Информатика модулі </b>

<li>Информатика

<li>Электронды үкімет

<li>Delphi программалау тілі

</ol>

<OL TYPE="I">

<Font size="6"> <b> Психиатрия модулі</b>

<li>Наркология

<li>Психология

<li>Психиатрия

</ol>

<OL TYPE="A">

<Font size="6"> <b> Философия модулі </b>

<li>Философия

<li>Социология

<li>Құқық

</ol>

     </body>

</html>

 

Краткое описание материала

Практикалық жұмыс. Тізімдерді құру. Сырғымылы жолдарды ұйымдастыру

    DOCX

Файл будет скачан в формате:

    DOCX

Краткое описание материала

Автор материала

Калиева Гульназ Рахметуллаевна

Преподаватель информатики

  • На сайте: 11 лет и 1 месяц
  • Всего просмотров: 21351
  • Подписчики: 0
  • Всего материалов: 5
  • 21351
    просмотров
  • 5
    материалов
  • 0
    подписчиков

Настоящий материал опубликован пользователем Калиева Гульназ Рахметуллаевна.
Инфоурок является информационным посредником. Всю ответственность за опубликованные материалы несут пользователи, загрузившие материал на сайт. Если Вы считаете, что материал нарушает авторские права либо по каким-то другим причинам должен быть удален с сайта, Вы можете на материал.

ИИ для создания материалов

Создавайте материалы с ИИ

Если готовые материалы не подошли — помогут нейросети

Конспекты, тесты, презентации, рабочие листы и другие материалы по ФГОС — под ваш урок, класс и цели занятия за пару минут.

Попробовать бесплатно

Выберите инструмент

~230

Нейросети могут ошибаться. Обязательно проверяйте ответы.

Другие материалы

Вам будут интересны эти курсы: