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

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

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

Добавлен: 06.04.2021

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

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

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

 

16

В

 

отличие

 

от

 

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

 

и

 

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

 

списков

которые

 

могут

 

содержать

 

помимо

 

самих

 

элементов

 

еще

 

и

 

другие

 

списки

список

 

опреде

-

лений

 

состоит

 

всего

 

из

 

двух

 

частей

самого

 

определения

  (

термина

и

 

его

 

содержательной

 

части

 (

описания

). 

Структура

 

списка

 

определений

 

описывается

 

тегом

-

контейнером

 

<DL> 

(Definition List), 

внутри

 

которого

 

указывается

 

тег

 

<DT>

 (Definition Term), 

выделяющий

 

заголовок

 

определения

и

 

тег

 

<DD>

 (Definition Description), 

описывающий

 

содержательную

 

часть

 

определения

Для

 

двух

 

последних

 

тегов

 

наличие

 

закрывающих

 

тегов

 

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

Пример

 

использования

 

списков

 

определений

 

приведен

 

соответственно

 

на

 

рис

. 10 

и

 

в

 

листинге

 1.8. 

 

 

 

Рис

. 10. 

Пример

 

использования

 

списков

 

определений

 

 

Листинг

 1.8.

 

Пример

 

использования

 

списков

 

определений

 

<HTML> 
 <HEAD> 
  <TITLE>

Пример

 

использования

 

списков

  

                               

определений

</TITLE> 

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


background image

 

17

      LINK="#00FF00" ALINK="#00FF00" VLINK="blue"> 
 <DL> 
 <H3 ALIGN="center">

Редакторы

 HTML-

документов

</H3> 

   <DT><B>

Визуальные

 Web-

редакторы

  

                            (WYSIWYG-

редакторы

)</B> 

   <DD><SMALL>

Редакторы

которые

 

позволяют

 

создавать

 

HTML-

документы

 

без

 

знания

 

языка

 HTML. 

В

 

том

 

виде

как

 

страница

 

будет

 

смотреться

 

в

 

рабочем

 

окне

 

программы

в

 

конечном

 

итоге

 

его

 

и

 

будет

 

отображать

 

брау

-

зер

.</SMALL><BR> 

   <DT><B>HTML-

редакторы

</B> 

   <DD><SMALL>

Программы

предназначенные

 

для

 

людей

разбирающихся

 

в

 

конструкциях

 

языка

 HTML 

и

 

позволяющие

 

нажатием

 

конкретных

 

кнопок

 

вставлять

 

в

 

текущий

 

доку

-

мент

 

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

 

теги

 

или

 

целые

 

конструк

-

ции

.</SMALL><BR> 

   <DT><B>

Текстовыв

 

редакторы

</B> 

   <DD><SMALL>

Офисные

 

редакторы

 

для

 

работы

 

с

 

текстом

В

 

них

 

также

 

иногда

 

присутствует

 

подсветка

 

синтаксиса

 

и

 

автоматизация

 

некоторых

 

функций

Основное

 

отличие

 

от

 HTML-

редакторов

 

заключается

 

в

 

отсутствии

 

возможно

-

сти

 

вставки

 

тегов

 

и

 np.</SMALL><BR> 

 </DL> 
</BODY> 
</HTML>

 

Как

 

видно

 

из

 

листинга

 1.8, 

заголовок

 

определения

 

и

 

содержательная

 

часть

 

списка

 

определений

 

позволяют

 

применять

 

форматирование

 

текста

а

 

также

 

некоторые

 

теги

 

структурного

 

форматирования

Также

 

видно

что

 

каждое

 

определение

 

в

 

коде

 

разделено

 

тегом

 

переноса

 

строки

 

<BR>

Если

 

этого

 

не

 

сделать

большинство

 

браузеров

 

создаст

 

между

 

последней

 

и

 

пред

-

последней

 

строкой

 

содержательной

 

части

 

определения

 

промежуток

боль

-

ший

 

по

 

размеру

чем

 

между

 

остальными

 

строками

 

описания

Помимо

 

этого

в

 

структуру

 

списков

 

определений

 

можно

 

включать

 

дру

-

гие

 

типы

 

списков

 – 

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

 

и

 

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

 (

в

 

т

ч

с

 

графически

-

ми

 

маркерами

). 

Тег

 

структуры

 

списка

 

определений

 

<DL>

 

может

 

содержать

 

параметр

 

COMPACT

суть

 

которого

 

была

 

описана

 

в

 

разделах

 

этой

 

главы

посвящен

-

ных

 

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

 

и

 

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

 

спискам

1.9. 

Другие

 

списки

 

К

 

спискам

 

других

 

типов

 

можно

 

отнести

 

списки

описываемые

 

тегами

 

<DIR> 

и

 

<MENU>

Изначально

 

такие

 

списки

 

планировалось

 

делать

 

более

 

компактными

 

и

 

строгими

 

по

 

отношению

 

к

 

какому

-

либо

 

форматированию


background image

 

18

Также

 

предполагалось

 

наложить

 

ряд

 

ограничений

на

 

длину

 

строки

 

эле

-

ментов

 

списка

на

 

количество

 

символов

 

в

 

тексте

 

и

 

пр

Тем

 

не

 

менее

в

 

последней

 

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

 HTML 

списки

 

этих

 

типов

 

бы

-

ли

 

названы

 

отмененными

несмотря

 

на

 

их

 

поддержку

 

большинством

 

со

-

временных

 

браузеров

Вместо

 

<DIR>

 

и

 

<MENU>

 

Консорциум

 W3C 

реко

-

мендует

 

использовать

 

стандартные

 

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

 

списки

2. 

Таблицы

 

в

 HTML-

документах

 

2.1. 

Табличное

 

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

 

данных

 

Одним

 

из

 

наиболее

 

мощных

 

и

 

гибких

 

средств

 

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

 

информа

-

ционных

 

данных

 

в

 HTML 

по

 

праву

 

являются

 

таблицы

В

 

повседневной

 

жизни

решая

 

те

 

или

 

иные

 

задачи

мы

 

часто

 

сталкиваемся

 

с

 

таблицами

Однако

 

в

 HTML 

таблицы

 

не

 

ограничиваются

 

удобным

 

средством

 

структу

-

рирования

 

информации

Сегодня

 

таблица

 

становится

 

основой

 

большинства

 

электронных

 

документов

структура

 

которых

 

может

 

включать

 

самые

 

раз

-

нообразные

 

элементы

 HTML. 

Таблицы

изначально

 

избранные

 

в

 

качестве

 

визуального

 

способа

 

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

 

данных

сейчас

 

имеют

 

гораздо

 

более

 

важную

 

функцию

 – 

управление

 

структурой

 HTML-

документа

 

в

 

целом

Удобство

 

размещения

 

данных

 

в

 

таблице

 

неоспоримо

а

 

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

 

пе

-

ред

 

другими

 

средствами

 

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

 

информации

  (

например

списки

позволяют

 

считать

 

таблицы

 

основополагающим

 

структурным

 

элементом

 

любого

 HTML-

документа

Однако

 

первостепенной

 

задачей

 

таблицы

 

все

 

же

 

является

 

представле

-

ние

 

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

 

данных

Поэтому

 

далее

 

речь

 

пойдет

 

о

 

том

как

 

пра

-

вильно

 

создавать

 

таблицы

 (

подробнее

 

о

 

таблицах

используемых

 

в

 

качест

-

ве

 

структурной

 

основы

 HTML-

документов

будет

 

рассказано

 

в

 

разд

. «

Вло

-

женные

 

таблицы

»)

.

 

2.2. 

Создание

 

простейших

 

таблиц

 

HTML-

конструкция

 

таблицы

 

может

 

содержать

 

множество

 

различных

 

тегов

 

и

 

параметров

часть

 

которых

 

распространена

а

 

часть

 

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

 

лишь

 

в

 

редких

 

случаях

Основным

 

тегом

-

контейнером

 

таблицы

 

является

 

тег

 

<TABLE>

кото

-

рый

 

требует

 

обязательного

 

присутствия

 

закрывающего

 

тега

Любая

 

табли

-

ца

 

состоит

 

из

 

ряда

 (

тег

-

контейнер

 

<TR>

, Table Row), 

содержащего

 

опреде

-

ленное

 

количество

 

ячеек

  (

тег

-

контейнер

 

<TD>

, Table Data). 

В

 

принципе

тег

 

<TD>

 

предназначен

 

для

 

указания

 

данных

 

в

 

таблице

а

 

для

 

размещения

 

заголовков

 

в

 

ячейке

 

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

 

тег

 

<TH>

 (Table Header). 

Различие

 

между

 

этими

 

двумя

 

тегами

 

заключается

 

в

 

визуальном

 

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

 

данных

 

внутри

 

таблицы

по

 

умолчанию

 

текст

размещенный

 

в

 

теге

 

<TH>

отобра

-


background image

 

19

жается

 

жирным

 

начертанием

 

с

 

типом

 

выравнивания

 

по

 

центру

а

 

текст

 

тега

 

<TD>

 – 

обычным

 

начертанием

 

с

 

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

 

по

 

левому

 

краю

Теги

 

<TR>

<TD>

 

и

 

<TH>

 

могут

 

не

 

иметь

 

своих

 

закрывающих

 

тегов

Од

-

нако

 

все

 

же

 

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

 

их

 

указывать

 

для

 

предотвращения

 

ошибок

кото

-

рые

 

могут

 

возникнуть

 

при

 

создании

 

сложных

 

вложенных

 

таблиц

Тег

 

<TABLE>

как

 

уже

 

было

 

сказано

обязательно

 

должен

 

иметь

 

закрывающий

 

тег

.  

Таблица

 

может

 

состоять

 

из

 

любого

 

количества

 

рядов

  (

<TR>

), 

каждый

 

из

 

которых

 

может

 

включать

 

любое

 

количество

 

ячеек

  (

<TD>

<TH>

). 

При

 

этом

 

один

 

ряд

 

таблицы

 

не

 

может

 

содержать

 

ячейки

 

другого

 

ряда

.

 

Таблице

 

можно

 

присвоить

 

заголовок

 

с

 

помощью

 

тега

-

контейнера

 

<CAPTION>

который

 

указывается

 

сразу

 

же

 

после

 

тега

 

<TABLE>

 (

в

 

принци

-

пе

расположение

 

тега

 

<CAPTION>

 

возможно

 

в

 

любом

 

месте

 

основного

 

тега

 

таблицы

за

 

исключением

 

областей

 

описания

 

тегов

 

рядов

 

и

 

ячеек

однако

 

в

 

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

 

такой

 

подход

 

не

 

приветствуется

Пример

 

простейшей

 

таблицы

 

приведен

 

соответственно

 

в

 

листинге

 2.1 

и

 

на

 

рис

. 11. 

Листинг

 4.1. 

Пример

 

простейшей

 

таблицы

 

<HTML> 
<HEAD> <TITLE>

Пример

 

простейшей

 

таблицы

</TITLE> </HEAD> 

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

  <TABLE BORDER> 

    <CAPTION>

Пример

 

простейшей

 

таблицы

</CAPTION> 

    <TR> 

      <TH>

Ячейка

 

с

 

заголовком

</

ТН

      <TD>

Ячейка

 

с

 

обычным

 

текстом

</TD> 

    </TR> 
  </TABLE> 

  </BODY> 
</HTML>

 

 

 

Рис

. 11.

 

Пример

 

простейшей

 

таблицы

 


background image

 

20

Далее

 

более

 

подробно

 

будет

 

рассказано

 

об

 

основных

 

параметрах

 

(

а

 

также

 

их

 

возможных

 

значениях

упомянутых

 

тегов

 

таблицы

2.3. 

Параметры

 

тега

 

<TABLE>

 

Тег

 <TABLE> 

является

 

основным

 

тегом

 

таблицы

 

и

 

может

 

содержать

 

ряд

 

параметров

каждый

 

из

 

которых

 

не

 

обязателен

 

для

 

указания

Следует

 

заметить

что

 

некоторые

 

популярные

 

браузеры

 (Internet Explorer, Netscape 

и

 

др

.) 

поддерживают

 

часть

 

дополнительных

 

параметров

 

таблицы

Далее

 

речь

 

пойдет

 

о

 

наиболее

 

распространенных

 

параметрах

 

тега

 

<TABLE>

под

-

держиваемых

 

большинством

 

современных

 

браузеров

Параметр

 

BORDER

 

С

 

помощью

 

параметра

 

BORDER

 

можно

 

задавать

 

рамку

показывающую

 

внутреннюю

 

структуру

 

таблицы

которая

 

состоит

 

из

 

определенного

 

коли

-

чества

 

рядов

 

и

 

ячеек

Отсутствие

 

данного

 

параметра

 

означает

что

 

рамка

 

не

 

будет

 

отображаться

 

браузером

Необходимость

 

в

 

таком

 

варианте

 

может

 

возникнуть

например

при

 

составлении

 

больших

 

списков

 

или

 

при

 

созда

-

нии

 

таблицы

 

в

 

качестве

 

основы

 HTML-

документа

Значением

 

параметра

 

BORDER

 

может

 

быть

 

любое

 

целое

 

число

указы

-

ваемое

 

в

 

пикселах

<TABLE BORDER="2"> 
<TR> 
<

Т

D>

Ячейка

 1</TD> 

<

Т

D>

Ячейка

 2</TD> 

</TR> 
</TABLE>

 

При

 

отсутствии

 

установленного

 

значения

 

параметр

 BORDER 

прини

-

мает

 

вид

 

BORDER="1"

.

 

Параметр

 

BORDERCOLOR

 

Параметр

 

BORDERCOLOR

 

предназначен

 

для

 

определения

 

цвета

 

рамки

 

вокруг

 

таблицы

  (

поддерживается

 

только

 Internet Explorer). 

Значение

 

ука

-

зывается

 

в

 

шестнадцатеричном

 

формате

 (

например

#FFCC00

или

 

в

 

виде

 

наименования

 (

например

green

). 

Параметр

 

CELLSPACING

 

Параметр

 

CELLSPACING

 

задает

 

расстояние

 

между

 

соседними

 

ячейка

-

ми

 

таблицы

 

по

 

вертикали

 

и

 

горизонтали

Значение

 

параметра

 

указывается

 

в

 

пикселах

 

и

 

не

 

может

 

быть

 

пропущено

При

 

конструкции

 

CELLSPACING="0"

 

ячейки

 

таблицы

 

сольются

т

к

параметр

 

устанавли

-

вает

 

нулевое

 

значение

 

расстояния

 

между

 

соседними

 

ячейками