ВУЗ: Не указан

Категория: Не указан

Дисциплина: Не указана

Добавлен: 06.04.2021

Просмотров: 954

Скачиваний: 1

ВНИМАНИЕ! Если данный файл нарушает Ваши авторские права, то обязательно сообщите нам.
background image

ФЕДЕРАЛЬНОЕ

АГЕНТСТВО

ПО

ОБРАЗОВАНИЮ

ГОСУДАРСТВЕННОЕ

ОБРАЗОВАТЕЛЬНОЕ

УЧРЕЖДЕНИЕ

ВЫСШЕГО

ПРОФЕССИОНАЛЬНОГО

ОБРАЗОВАНИЯ

«

ВОРОНЕЖСКИЙ

ГОСУДАРСТВЕННЫЙ

УНИВЕРСИТЕТ

» 

 
 
 
 
 
 
 
 
 
 

И

.

Д

Коструб

М

.

М

Портнов

WEB-

ДИЗАЙН

ОСНОВЫ

ЯЗЫКА

 HTML 

Часть

 2 

Методические

указания

для

вузов

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Издательско

-

полиграфический

центр

Воронежского

государственного

университета

2008 


background image

2

 
 
 
 
 
 
 

Утверждено

научно

-

методическим

советом

факультета

ПММ

 14 

марта

2008 

г

., 

протокол

 7 

 
 
 
 
 

Рецензент

канд

физ

.-

мат

наук

доцент

кафедры

математического

обеспе

-

чения

ЭВМ

факультета

ПММ

ВГУ

О

.

Д

Горбенко

 
 

Учебное

пособие

подготовлено

на

кафедре

нелинейных

колебаний

факуль

-

тета

ПММ

Воронежского

государственного

университета

.  

 
 
 

Рекомендуется

для

студентов

четвертого

курса

факультета

ПММ

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Для

специальности

: 010501 – 

Прикладная

математика

и

информатика


background image

1. 

Использование

списков

1.1. 

Зачем

нужны

 HTML-

списки

Различные

списки

играют

далеко

не

последнюю

роль

в

нашей

повсе

-

дневной

жизни

Возникает

вопрос

 – 

а

почему

мы

так

часто

прибегаем

к

этому

средству

представления

информации

Во

-

первых

Информация

в

виде

списка

позволяет

разбить

большие

мас

-

сивы

данных

на

отдельные

четкие

фрагменты

которые

человеку

гораздо

удобнее

воспринимать

нежели

весь

поток

целиком

.  

Во

-

вторых

Списки

позволяют

создавать

понятную

и

логичную

внут

-

реннюю

структуру

информационных

данных

ориентироваться

в

которой

 – 

дело

простое

и

удобное

.  

В

-

третьих

Использование

списков

удобно

для

отображения

опреде

-

ленных

пошаговых

и

прочих

последовательных

процессов

.  

При

работе

с

текстом

в

различных

программах

типа

 Microsoft Word 

создание

списков

не

представляется

сложным

делом

 – 

надо

всего

лишь

указать

область

данных

которую

текстовому

редактору

необходимо

пре

-

вратить

в

список

В

языке

разметки

 HTML 

за

организацию

списков

отвечает

целый

ряд

тегов

конструкции

которых

должны

соответствовать

определенным

пра

-

вилам

структуризации

информационных

данных

с

помощью

 HTML. 

Спецификация

 HTML 

предусматривает

три

основных

типа

списков

нумерованные

списки

маркированные

списки

списки

определений

Рассмотрим

каждый

из

названных

типов

более

подробно

1.2. 

Нумерованные

списки

Нумерованный

список

часто

называется

упорядоченным

 (Ordered List) 

и

представляет

собой

определенную

последовательность

элементов

Для

создания

нумерованного

списка

используется

тег

-

контейнер

<OL>

внутри

которого

располагаются

пункты

перечня

информационных

данных

за

указание

которых

отвечает

специальный

тег

<LI>

 (List Item – 

пункт

списка

или

элемент

списка

) (

листинг

 1.1, 

рис

. 1). 

Листинг

 1.1.

Пример

нумерованного

списка

<HTML> 

<HEAD> 

<TITLE>

Пример

нумерованного

списка

</TITLE> 

</HEAD> 

<BODY BGCOLOR="#FFFFFF" TEXT="black"  
      LINK="#00FF00" ALINK="#00FF00" VLINK="blue"> 

<H3>

Пример

нумерованного

списка

</

Н

3> 


background image

 4

<HR ALIGN="center" NOSHADE WIDTH="98%"> 
<OL> 

<FONT F

АСЕ

="

Та

h

о

m

а

"> 

<B>

Визуальные

эффекты

 Adobe Photoshop 7:</B> 

</FONT> 

  <LI>Drop Shadow; 
  <LI>Bevel and Emboss; 

      <LI>Color Overlay. 

</OL> 

</BODY> 
</HTML> 

Рис

. 1. 

Пример

нумерованного

списка

Как

видно

из

примера

после

каждого

пункта

списка

осуществляется

перенос

строки

причем

без

указания

каких

-

либо

структурных

тегов

Также

следует

заметить

что

закрывающий

тег

</LI>

отсутствует

хотя

и

суще

-

ствует

в

спецификации

 HTML (

Консорциум

 W3C 

признал

этот

закрываю

-

щий

тег

необязательным

). 

Если

заголовок

списка

 «

Визуальные

эффекты

 Adobe Photoshop 7:» 

раз

-

мещается

между

тегом

<OL>

и

первым

пунктом

списка

<LI>

то

он

будет

отделен

от

начала

самого

списка

одним

переносом

строки

и

отступом

от

левого

края

документа

 (

как

и

все

пункты

списка

). 

При

указании

заголовка

перед

тегом

<OL>

браузер

интерпретируя

 HTML-

код

создаст

двойной

пе

-

ренос

и

разместит

текст

заголовка

левее

пунктов

списка

 (

рис

. 2). 


background image

 5

Рис

. 2. 

Пример

нумерованного

списка

с

заголовком

размещенным

  

перед

тегом

<OL>

Иногда

может

возникнуть

ситуация

когда

список

содержит

определен

-

ный

разрыв

в

последовательности

представления

пунктов

  (

например

по

-

сле

пункта

 3 

должен

идти

пункт

 5). 

Для

этой

цели

используется

специаль

-

ный

параметр

тега

<LI>

 – 

VALUE

 (

листинг

 1.2, 

рис

. 3). 

Листинг

 1.2.

Пример

нумерованного

списка

с

разрывом

последовательности

<HTML> 

<HEAD> 
<

Т

I

Т

LE>

Пример

нумерованного

списка

с

разрывом

  

       

последовательности

</TITLE> 

</HEAD> 
<BODY BGCOLOR="#FFFFFF" TEXT="black"  

LINK="#00FF00" ALINK="#00FF00" VLINK="blue"> 

<H3>

Пример

нумерованного

списка

</H3> 

<HR ALIGN="center" NOSHADE WIDTH="98%"> 
<FONT 

РАСЕ

="Tahoma"> 

<

В

>

Визуальные

эффекты

 Adobe Photoshop 7: 

</B></FONT> 

<OL> 

<LI>Drop Shadow; 
<LI>Bevel and Emboss; 
<LI>Color Overlay. 
<BR>. . . 
<LI VALUE="5">Stroke 

</OL> 
</BODY> 
</HTML>