- •Компонентная структура Интернета
- •История возникновения и развития Интернета. Интернет в России. Создатели Интернета.
- •Администрирование Интернета. Финансовая политика. Интернет с точки зрения пользователя.
- •Основы сети Интернет. Соединение компьютеров в Интернете.
- •Базовые протоколы Интернета и принцип коммутации пакетов.
- •Протокол ip
- •Протокол tcp
- •Роль протокола tcp.
- •Объединение сетей в Интернете с помощью маршрутизаторов и магистральная архитектура Интернета.
- •Передача и доставка ip-дейтаграмм c помощью маршрутизаторов. Пример межсетевого соединения. Роль протокола ip.
- •Непосредственный и косвенный маршруты. Таблицы маршрутизации. Алгоритмы маршрутизации и их классификация. Протоколы маршрутизации и их классификация
- •Службы Интернета. Сервис Telnet. Электронная почта e-mail. Группы новостей usenet. Сервис ftp.
- •World Wide Web (Всемирная паутина). Структура www. Сервис irc. Сервис Archie. Система Gopher.
- •Клиент - серверная архитектура. Клиенты. Серверы. Информационные серверы.
- •Адресация в Интернете. Синтаксис ip-адреса. Классификация ip-адресов. Доменная система имен (dns). Преобразования имен в цифровые адреса .
- •Универсальный указатель ресурса url. Доступ к ресурсам Интернета. Web-узлы, страницы и ссылки. Адреса электронной почты.
- •Практические рекомендации по подключению и работе в Интернете. Утилиты и дополнительные программы для работы в Интернете. Выбор провайдера.
- •Способы подключения к Интернету
- •Технологии, архитектуры и средства создания распределенных Web-приложений (Компонентная структура).
- •Тенденции в области компьютерных, информационных технологий и Интернет. Монолитные, клиент-серверные и распределенные приложения. Хостинг и хакинг.
- •Вопросы проектирования Web-сайтов. Базовый набор компонентов Web-сайта. Текст. Графическое оформление. Средства навигации. Дополнительные компоненты.
- •Основные этапы создания сайта. Определение примерного содержимого ресурса. Подготовка графики. Окончательное формирование страниц. Составление серверных скриптов. Тестирование сайта.
- •Реклама сайта. Баннерная реклама.. Сбор и анализ информации об аудитории сайта. Интерактивные службы. Многоязыковая и мультисистемная поддержка.
- •Выбор платформы для размещения сайта. Бесплатный хостинг. Службы бесплатного хостинга. Платный хостинг.
- •Собственный хостинг. Web-серверы. Функции Web-сервера. Примеры Web-серверных программ.
- •Публикация сайта и его сопровождение. Обновление информации. Информация и орфография. Стиль изложения информации и ее достоверность. Использование чужой информации.
- •Элементы html. Историческая справка. Языки разметки. Версии html.
- •37. Стилевое оформление.
- •41. Тестирование и настройка Web-узла. Проверка работающих внешних и внутренних гиперссылок. Пересчет (обновление) гиперссылок.
- •46. Классификация Web-ресурсов. Корпоративные и Промо/презентационные Web-сайты.
- •1. Коммерческие сайты.
- •2. Некоммерческие сайты.
- •47. Классификация Web-ресурсов. Электронные магазины (Витрина, Торговая площадка, Торговый ряд, Автоматизированный магазин). Онлайн-сервисы.
- •1. Коммерческие сайты.
- •2. Некоммерческие сайты.
- •Организация Internet-магазина
- •48. Классификация Web-ресурсов. Контент-проекты. Порталы. Коммьюнити (Интернет-форумы, Живые журналы).
- •1. Коммерческие сайты.
- •2. Некоммерческие сайты.
- •49. Предварительное позиционирование Web-сайта. Выбор доменного имени. Распределение обязанностей по работе над Web-сайтом. Работа по исследованию аудитории Web-сайта.
- •50. Понятие о языке xml и причины его появления.
- •51. Концепция xml и его применения.
- •52. Основы синтаксиса xml. Язык описания стилей xsl.
- •53. Delphi и разработка Интернет-приложений. История, эволюция и концепция Delphi.
- •54. Среда Delphi 5 и ее составляющие.
- •55. Пример создания простейшей программы в среде Delphi 5.
- •56. Создание приложений Web-сервера в Delphi. Пример.
- •57. Прием Web-модулем данных от Web-формы.
- •58. Архитектуры субд и Интернет.
- •59. Технологии dde, ole, dll взаимодействия приложений.
- •60. Создание распределенных приложений на основе технологии com/dcom.
- •61. Создание распределенных приложений на основе технологии corba.
Публикация сайта и его сопровождение. Обновление информации. Информация и орфография. Стиль изложения информации и ее достоверность. Использование чужой информации.
Публикация сайта и его сопровождение.
Публикацией и сопровождение сайта занимается администратор веб-сайта (функции – установка, настройка, работа с ним), содержательной стороной вопроса занимается контент-менеджер. Публиковать сайт можно на хостингах: платных, бесплатных или собственных.
Обновление информации.
Администратор веб-сайта и контент-менеджер должны поддерживать сайт в актуальном состоянии, а также всю информацию представленную на веб-ресурсе.
Информация и орфография. Стиль изложения информации и ее достоверность.
Содержание должно быть достоверным и содержательным
Соблюдение грамотности
Использование иностранных слов только по делу
Использование цензурных слов; не использование сленга
Форматирование (стили, отступы, шрифты, выделения)
Разрешения для разных мониторов (здесь помогут таблицы и фреймы)
Возможно использование графики для изложения информации:
Использование по делу (лишнее – увеличивает время загрузки)
Форматы должны быть грамотно подобраны
Если графика обязательна, то нужно текстом описать графика (дополнительно)
Перегруженность графикой затрудняет восприятие
Использование современных средств (флешки, анимация, видео)
Использование чужой информации.
При использовании информации из других источников, источник должен в обязательном порядке быть указан.
Элементы html. Историческая справка. Языки разметки. Версии html.
HTML – язык гипертекстовой разметки. Впервые упоминается в 1945 г. В. Буш.
ISO 8849 – 1986 г.
Историческая справка. Версии HTML.
1992 – Тим Б. Ли - разработан язык HTML, URL, HTTP, WWW
1993 – HTML+
1994 – HTML 2.0
1996 – HTML 3.2 (появляются фреймы)
1997 – HTML 4.0 (DHTML – динамические фреймы, бегущая строка, каскадные таблицы стилей, ядро (стабильное))
Элементы HTML.
Гипер – «за»
Гипертекст – ссылки за пределы текста.
Ссылки: <A href= “…“>
Закладки – ссылка на открытие места страницы, текста.
Графика: команда на использование картинок <img src=”…”>. Можно использовать графику в виде ссылки:
<A href=www.cont.com>
<ing src=”cont.gif”></a>
Таблицы: могут использоваться для форматирования текста (nowrap – таблица не переноситься, а уходит за границы сайта).
Фреймы: задается шаблон, а содержимое изменяется файлами. Плавающие фреймы: позволяют вставить фрейм в обычные страницы и позиционировать этот фрейм как картинку.
Формы: для запуска каких-либо приложений на сервере и организации динамических страниц необходимо сделать обмен данными с сервером. Передача данных на сервер возможна двумя методами – POST (данные передаются в виде потока – пользователь не видит этот поток данных) и GET (по умолчанию, данные передаются с параметрами – пользователь их видит).
Стилевое оформление страниц: каскадные таблицы стилей имеют следующие преимущества – установить определенный стиль таблиц, размеры, цвета, отступы; изменение стилей с минимальными затратами; ядро языка выражается в тэгах, а с помощью таблиц стилей можно проводить обновление версии.
Применение классов: определенные элементы можно формировать в классы. Этим классам можно присваивать определенные свойства.
Также можно использовать уникальные идентификаторы, задание состояний с помощью таблиц-стилей.
Структура HTML-страницы. Тэги <HTML>, <HEAD>, <TITLE>, <BODY>, <МЕТА>. Задание цвета фона, атрибут bgcolor. Примеры использования.
Пример Web-страницы
HTML><HEAD><TITLE>Структура Web-страницы</title>
<STYLE> H2 {font-family: verdana, sans-serif, arbat;}
CODE {font-family: Arial;} </style>
<META name="Author" content="Иванов И. И.">
<META name="Keywords" content="WWW, HTML, document, element">
<META http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<BODY bgcolor=#FFFFFF>
<!-- Комментарий к странице -->
<A href="start.htm"><IMG align="right" src="soder.jpg" alt="На титульную страницу"
border=0 width=150 height=24></a><BR clear="right">
<A name="top"></a>
Переход в <A href="#bottom">конец</a> документа<P>
Переход к <A href="#S001"><B>ссылке 1</b></a><P>
<P>
<HR>
<H1>Заголовок 1</h1>…………….<H6>Заголовок 6</h6>
<P>Существует шесть уровней заголовков, которые обозначаются H1...H6.
Заголовок уровня 1 самый крупный, а уровень 6 обеспечивает самый маленький
заголовок. Шаблон дает представление об относительных размерах букв в заголовках. Для заголовков можно использовать атрибут, задающий выравнивание влево, по центру или вправо.</p>
<HR>
Здесь расположена <B>ссылка 1</b><A name="S001"></a>
<HR>
<P>Здесь должен располагаться оригинальный текст Web-страницы
<HR>
<A name="bottom"></a><P>
Переход в <A href="#top">начало</a> документа.
</body></html>
При рассмотрении элементов языка будем приводить оба тега: начальный и конечный. Например: <I> </i>. Следует подчеркнуть, что в большинстве случаев разработчик должен использовать два тега для каждого элемента. Для имен тегов можно использовать как прописные, так и строчные буквы латинского алфавита.
<HTML> </html>
Обозначение документа на языке HTML. Данный элемент является самым внешним, так как, между его начальным и конечным тегами должна находиться вся Web-страница. Он имеет атрибуты version, lang и dir, которыми в данном случае редко кто пользуется, и допускает вложение элементов HEAD, BODY, FRAMESET и других, определяющих общую структуру Web-страницы. Естественно, что конечным тегом </html> заканчиваются все подобные документы.
<HEAD> </head>
Область заголовка Web-страницы. Иными словами, ее первая часть. Так же, как и предыдущий элемент, HEAD служит только для формирования общей структуры документа. Этот элемент может иметь атрибуты lang и dir, должен включать элемент TITLE и допускает вложение элементов МЕТА, LINK, OBJECT, SCRIPT, STYLE.
<TITLE> </title>
Элемент для размещения заголовка Web-страницы. Строка текста, расположенная внутри этого элемента, отображается не в документе, а в заголовке окна браузера. Эта строка часто используется при организации поиска в WWW.
<BODY> </body>
Этот элемент заключает в себе гипертекст, который определяет собственно Web-страницу. Это та произвольная часть документа, которую разрабатывает автор страницы и которая отображается браузером. Внутри элемента BODY можно использовать все элементы, предназначенные для дизайна Web-страницы. Внутри начального тега элемента BODY можно расположить ряд атрибутов, обеспечивающих установки для всей страницы целиком.
фон страницы background="Путь к файлу фона"
Более простое оформление фона сводится к заданию его цвета: bgcolor="#RRGGBB"
Цвет фона задается тремя двухразрядными шестнадцатеричными числами, которые определяют интенсивность красного, зеленого и синего цветов соответственно (но можно указать в кавычках просто цвет, например, “red”).
цвет текста text="#RRGGBB"
цвета текста гиперссылок link="#RRGGBB"
цвет для просмотренных гиперссылок vlink="#RRGGBB"
изменение цвета для последней выбранной пользователем гиперссылки alink="#RRGGBB"
<МЕТА>
Этот элемент содержит служебную информацию, которая не отражается при просмотре Web-страницы. Внутри него нет текста в обычном понимании, поэтому нет и конечного тега. Каждый элемент МЕТА содержит два основных атрибута, первый из которых определяет тип данных, а второй — содержание. Вот несколько примеров meta-данных.
• Дата, обозначающая «срок годности» документа: name="Expires" content="Дата"
• Адрес электронной почты: name="Reply-to" content="Имя@Адрес"
• Имя автора Web-страницы: name ="Author" content=" Имя автора"
• Набор ключевых слов для поиска: name="Keywords" content=" слово1, слово2 ..."
• Краткое описание содержания Web-страницы: name="Description" content="Содерж стр"
• Описание типа и хар-к Web-страницы: name="Content-Type" сопtепг="0писан стр"
• Указание приложения, в котором была создана Web-страница:
name="Generator" content="Название HTML-редактора"
Здесь и далее при описании элементов и их атрибутов курсивом выделены фрагменты, которые должны быть заполнены пользователем по его усмотрению. Атрибут name используется приложением-клиентом для получения дoпoлнитeльнoй информации о Web-страницах и их упорядочения. Этот атрибут часто заменяют атрибутом http-equiv. Он используется сервером для создания дополнительных полей при выполнении запроса.
Кроме этого, элемент МЕТА может содержать URL. Шаблон соответствующего атрибута таков:
URL="http://адрес
<!-- Комментарий -->
В любом языке программирования есть конструкции, позволяющие создавать произвольные ремарки. HTML в этом смысле — не исключение. Текст, введенный внутри этого элемента, игнорируется браузером. Эти элементы могут располагаться в любом месте Web-страницы. Без закрывающей угловой скобки здесь, по-видимому, не обойтись: комментарий должен быть отделен от основного текста. Признаком комментария служит восклицательный знак, а текст комментария должен обрамляться двойными дефисом. Например:
<!-- Начало вывода таблицы -->
Оформление текста. Тэги <Нх>, <P>, параметры align, left, right и center. Примеры использования.
Текст — единственный объект Web-страницы, который не требует специального определения. Иными словами, произвольные символы интерпретируются по умолчанию как текстовые данные. Но для форматирования текста существует большое количество элементов. Большинство из них, кроме специальных, поддерживает стандартные атрибуты: id, class, lang, dir, title, style и атрибуты событий. Например, только с помощью свойства text-indent можно задать величину отступа первой строки абзаца.
Форматировать текст можно и с помощью традиционных элементов: выделять фрагменты курсивом, полужирным, выбирать шрифт и т. д. Рассмотрим эти элементы. Для них могут быть использованы стандартные атрибуты id, class, lang, dir, title, style, атрибуты событий, а также атрибуты, определяющие уникальные свойтва определенных элементов
<STYLE> </style>
Если атрибут style позволяет задать свойства одного конкретного элемента, то элемент STYLE определяет свойства всех одноименных элементов, например:
<STYLE type="text/css">
Н1 {border-width: 1; border: groove; text-align: center; color: green}
H2 {color: maroon; font-style: italic}
CODE {font-family: Arial, Verdana; background: white} •
P {text-indent: 10; color: green; font-size: 12pt}
P CODE {font-weight: bold; color: violet; font-size: 12pt}
</style>
В этом случае для всей страницы создаются новые стили для заголовков первого и второго уровня. Для элементов CODE выбирается шрифт и цвет фона. Для абзацев (Р) выбирается величина отступа первой строки, цвет и размер букв. Этот простой пример показывает преимущества стилей: автор страницы может легко создать эффекты, недоступные при использовании только одних атрибутов.
Последним в нашем примере идет стиль для вложенных элементов. Он будет использован браузером только в том случае, когда элемент CODE окажется внутри элемента Р. При этом свойства текста будут унаследованы: от элемента абзаца —отступ (text-indent: 10);
от элемента CODE — фон (background: white).
А стиль, который можно условно назвать «P CODE» внесет дополнительные форматы:
полужирное начертание (font-weight: bold); фиолетовый цвет букв (color: violet) и размер символов (font-size: 12pt). Тут уместно вспомнить о многочисленныхэлементах содержания, которые пришли из предыдущих версий языка и вроде бы бесполезны: задачи, для которых они предназначались, кажутся сейчас архаичными. Действительно, зачем предусматривать отдельные элементы для таких объектов, как «текст телетайпа» или «символы, введенные с клавиатуры»? Стили дают таким элементам вторую жизнь. Вложения двух элементов позволяют создать любое количество комбинаций форматов.
Обратите внимание, что в последней строке приведенного выше примера элементы Р и CODE разделены пробелом. Когда элементы отделены друг от друга пробелами, это означает, что ряду элементов присваивается один и тот же стиль.
<Hl></hl>
Элемент заголовка. Существует шесть уровней заголовков, которые обозначаются Н1...Н6. Заголовок уровня 1 самый крупный, а уровень 6 обеспечивает самый маленький заголовок. Для заголовков можно использовать атрибут, задающий выравнивание влево, по центру или вправо:
allgn="left" align="center" align="right"
<HR>
Горизонтальная линия (horizontal rule) — очень часто используемый элемент. Во-первых, потому что с его помощью очень удобно делить страницу на части.
Элемент не имеет конечного тега, но допускает ряд атрибутов для выравнивания влево, по центру, вправо, по ширине: align="left" align="center" align="right" align="justify"
Можно задавать толщину линии: size=толщина в пикселах Можно управлять длиной линии: width =длина в пикселах width= длина в процентах%
Можно выбрать цвет: color="цвет"
<P></р>
Элемент абзаца (paragraph) — один из самых полезных. Он позволяет использовать только начальный тег, так как следующий элемент Р обозначает не только начало следующего абзаца, но и конец предыдущего. В тех случаях, когда по смыслу необходимо обозначить завершение абзаца, можно использовать и конечный тег. В некоторых случаях начальный тег удобно ставить в конце строки: он не только обозначит конец абзаца, но и выполнит функцию тега <BR> (разрыв строки). Например:
<P>Текст первого абзаца.
<P>Текст второго абзаца.</р>
Текст третьего абзаца.<Р>
Вместе с элементом абзаца можно использовать атрибут выравнивания align:
align="left" — выравнивание по левому краю;
align="center" - выравнивание по центру;
align=" right" — выравнивание по правому краю.
Для центрирования абзаца следует использовать такую конструкцию:
<Р align="center"> Текст абзаца
Абзацы форматируются браузером, и их вид зависит, в частности, от размера окна программы. Три следующих элемента позволяют внести некоторую определенность в формат абзаца.
<BR>
Элемент, обеспечивающий принудительный переход на новую строку. Он имеет только начальный тег. В месте его размещения строка заканчивается, а оставшийся текст печатается с новой строки.
Атрибут clear позволяет выравнивать объекты (например, рисунки) относительно текста, в котором использован элемент BR. Если элемент объекта содержит атрибут align, то в расположенных рядом элементах BR должен присутствовать атрибут clear, например: <BR clear="right">
Значения атрибута:
попе — значение по умолчанию;
left — если объект выровнен влево;
right — если объект выровнен вправо;
all — для объекта, который может быть выровнен по любому краю.
Стандартные атрибуты: id, class, title, style.
<NOBR> </nobr>
Этот элемент по своему действию является прямой противоположностью предыдущего. Текст, заключенный между его тегами, будет выведен в одну строку. Если Длинная строка не уместится на экране, для ее просмотра придется использовать горизонтальную полосу прокрутки.
<PRE> </pre>
Элемент для обозначения текста, отформатированного заранее. Подразумевается, что текст будет выведен в том виде, в котором был подготовлен автором. Например, учитываются символы конца строки, появившиеся при наборе текста в редакторе. Во всех других случаях браузер игнорирует эти символы. Возможен и обратный эффект: если пользователь введет текст как одну длинную строку, то она не будет разорвана браузером, а уйдет за край окна программы. В этом смысле элемент PRE работает так же, как элемент NOBR. По умолчанию для отформатированного заранее текста выбирается моноширинный шрифт. Этот, элемент удобно использовать для показа листингов программ или для вывода текстовых документов, переформатирование которых может привести к искажению их смысла.
Для этого элемента определен специальный атрибут, который позволяет задать ширину блока текста в символах:
width=число-символов
Этот атрибут не поддерживается многими браузерами. Стандартные атрибуты: id, class, lang, dir, title, style, атрибуты событий.
30. Тэги, изменяющие начертания шрифта <B>, <I>, <U>, <strike>, <big>, <small>, <basefont SIZE=n>, <font SIZE=+\-n>, <sub>, <sup>. Примеры использования.
<B></b> |
Выделение текста полужирным шрифтом. Очень популярный элемент. Использование полужирного шрифта - прием, позаимствованный из текстовых редакторов. |
<I></i> |
Выделение текста курсивом. |
<U></u> |
Подчеркнутое начертание текста. |
<STRIKE> </strike>, или <S> </s> |
Зачеркнутое начертание текста. В настоящее время элемент STRIKE заменяют более простым в написании элементом S. |
<BIG> </big> |
Увеличение размера шрифта. |
<SMALL> </small> |
Уменьшение размера шрифта. |
<BASEFONT SIZE=n> |
Элемент, определяющий базовый (основной для всей страницы) размер шрифта. Внутри элемента необходимо указать атрибут: size=базовый размер шрифта Величина для этого атрибута может лежать в пределах от 1 до 7. По умолчанию используется величина 3. Установка, выполняемая этим элементом, имеет значение для элемента FONT, который позволяет задавать относительный размер шрифта. Другие атрибуты у этого элемента такие же, как и у элемента FONT. |
<FONT> </font> |
Определение типа, размера и цвета шрифта. Все эти характеристики определяются при помощи соответствующих атрибутов. Абсолютный размер шрифта задается атрибутом size (размер): size =абсолютный размер шрифта Этот атрибут может принимать значения от 1 до 7. Элемент FONT может с успехом заменять элементы заголовка Н1...Н6. Для элемента FONT можно использовать атрибут цвета: color="цвет". Для последних, например, не предусмотрено задание цвета букв. Чтобы заголовок, созданный на основе элемента FONT, хорошо смотрелся, этот элемент необходимо комбинировать с другими: CENTER, В, I, U и т. д. |
<FONT size=±n > |
Относительный размер шрифта (задаваться относительно базового): При назначении величины для этого атрибута надо учитывать величину базового размера. В сумме эти две величины должны соответствовать одному из абсолютных размеров. Так, для базового размера, равного 3, относительный размер может находиться в пределах от -2 до +4. Если величина выходит за допустимый предел, то используется либо шрифт размера 7, либо шрифт размера 1. |
<SUB> </sub> |
Элемент, создающий эффект нижнего индекса (subscript). |
<SUP> </sup> |
Элемент, создающий эффект верхнего индекса (superscript). |
31. Списки. Тэги <ul>,<li>,<ol>, параметры type, start. Примеры использования.
Списки (list) были введены в HTML, несомненно, под влиянием успеха текстовых редакторов. Список отличается от обычного текста прежде всего тем, что пользователю не надо думать о нумерации его пунктов: эту задачу программа берет на себя. Если список дополняется новыми пунктами или укорачивается, нумерация корректируется автоматически. В случае ненумерованных списков программа ставит перед каждым пунктом маркеры: кружки, прямоугольники, ромбы или другие изображения. В результате список принимает удобочитаемый, «фирменный» вид. Теги для создания списков можно условно разделить на две группы: одни определяют общий вид списка (и позволяют указывать атрибуты), а другие задают его внутреннюю структуру. В списках можно использовать стандартные атрибуты. Существует несколько разновидностей списков.
<UL><LI></ul>
Самым простым является ненумерованный список (unordered list). Его шаблон представлен ниже:
<
Пункт 1 списка
Пункт 2 списка
Пункт 3 списка
UL>
<LI>Пункт 1 списка
<LI>Пункт 2 списка
<LI>Пункт 3 списка
</ul>
Элемент UL является своеобразным обрамлением списка. Он позволяет отделять один список от другого. Элемент LI обозначает каждый из пунктов
<OL>><LI></ol>
Структура нумерованного списка (ordered list) похожа на предыдущую:
<
I.
Пункт 1 II.
Пункт 2 III.
Пункт 3
<LI>Пункт 1
<LI>Пункт 2
<LI>Пункт 3
</ol>
Для него используется другой внешний тег: OL. В этом случае каждый пункт маркируется элементом упорядоченной последовательности: арабскими или римскими числами, буквами латинского алфавита.
Способ нумерации задается при помощи атрибута type.
Значения атрибута type
Атрибут |
Вид нумерации |
type="1" |
1, 2, 3, 4… |
type="i" |
i, ii, iii, iv… |
type="I" |
I, II, III, IV... |
type="a" |
a, b, c, d… |
type="A" |
A, B, C, D... |
Существует атрибут, который позволяет задать начальное значение для нумерации списка. Например, если использована буквенная нумерация, то значение атрибута start=4 означает, что нумерация списка начнется с литеры D. start=номер
Для элемента LI может быть использован атрибут, который определит номер для текущего пункта списка value= номер
Способ создания сложных списков — использование принципа вложения. Каждый элемент, определяющий пункт списка, может содержать еще один список. Вложенный список располагается с небольшим отступом вправо относительно списка верхнего уровня. Каждый из списков может быть создан и отлажен отдельно, а затем все составляющие могут быть объединены в один большой список. Доработка такого шаблона сводится к вписыванию конкретных строк текста в соответствующие пункты. Ниже дан пример такого шаблона: <UL>
<UL>
<
Пункт 1
Пункт
1.1
Пункт 1.2
Пункт 2
Пункт 2.1
Пункт 2.2
Пункт 3
1. Пункт 3.1
2. Пункт 3.2
<OL>
< LI >Пункт 1.1
<LI>Пункт 1.2
</ol>
<LI>Пункт 2
<OL>
<LI>Пункт 2. 1
<LI>Пункт 2.2
</ol>
<LI>Пункт 3
<OL>
<LI>Пункт 3. 1
<LI>Пункт 3.2
</ol>
</ul>
В таблицах стилей для списков предусмотрены специальные свойства. Например, в секции страницы HEAD можно определить стиль списка с маркерами в виде окружностей (circle):
<STYLE type="text/css">
<OL>c01 {list-style-type: circle}
</style>
Тогда в секции BODY может присутствовать список с маркерами в виде кружков:
<OL class="c01">
<LI> Пункт 1
<LI> Пункт 2
</ol>
32. Ссылки и графика. Тэги <а href=url>, <а Name= #имя_закладки>, <а НRЕF=#имя закладки>, <img SRC="имя_файла">. Вставка графического файла <img SRC="имя_файла">. Параметры height, width, align. Значения left, right, top, bottom и middle. Примеры использования.
<IMG>
Элемент для создания ссылки на графический файл (image). Он не содержит конечного тега — вся необходимая информация задается при помощи атрибутов. Этот элемент является универсальным: с его помощью можно использовать изображения в гиперссылках, вставлять картинки в таблицы, просто размещать рисунки на Web-странице, создавать маркеры, решать задачи дизайна и т. д.
Необходимым атрибутом является src — указатель на файл графики:
<IMG src="Ссылка на файл">
Ссылка на файл представляет собой URL. В некоторых случаях у пользователя может возникнуть желание скопировать в отдельную папку, какую-нибудь Web-страницу или набор страниц из Интернета. Это позволяет в дальнейшем использовать страницы, не подключаясь к Сети. Скопировать HTML-файлы легко: это сделает броузер. Сложнее с рисунками. Сначала их надо найти в папке кэша, скопировать в требуемую папку, а затем откорректировать значения всех атрибутов src, указав для них новый путь.
Высоту и ширину области, в которой демонстрируется рисунок, задают при помощи атрибутов height и width. В том случае, когда задается один из этих атрибутов, рисунок масштабируется таким образом, чтобы его высота или ширина соответствовали заданной. Второй размер устанавливается автоматически, в соответствующей пропорции. Таким образом, применение только одного из атрибутов изменяет оба размера рисунка. Если задать явным образом оба атрибута, то рисунок будет масштабироваться по двум осям в соответствии с заданным размером. Масштабирование, как правило, ухудшает качество изображения.
Если хотите, чтобы графический рисунок органически вписывался в дизайн вашей Вэб-страницы, то в этом вам поможет атрибут ALIGN тэга <IMG>. Этот атрибут допускает задание двух значений - left right. Значение left заставляет браузер помещать изображение слева от текста, а right - справа от него.
Атрибут ALIGN тэга <IMG>, принимающий значения top, middle, bottom позволяет задавать вертикальное положение текста относительно границ графического изображения. По умолчанию браузер выравнивает текст по нижней кромке изображения. Если в строке текста включено несколько изображений, то выравнивание может привести к неожиданным эффектам. Следует учесть и тот факт, что если атрибут ALIGN уже был применен для задания параметра обтекания графики текстом, установить признак выравнивания текста относительно графики в пределах конкретной страницы не удастся.
<A> </a>
HTML-документ может быть очень большим, и в этом случае пользователю должна быть предоставлена возможность быстрого перемещения к нужному разделу документа. Для этого можно использовать механизм гиперссылок. Необходимо также в нужных местах текста расставить соответствующие метки.
<a href="#Начало страницы">Наверх страницы</a>
В этом случае данной строке документа присваивается имя, и, следовательно, в другой части документа или даже на другом документе может быть создана гиперссылка, приводящая в эту точку. В то место, куда надо сделать переход надо вставить:
<a name="Начало страницы"></a>
<A href="URL">
или
<A href="Протокол ://Адрес ссылки">
Например:
<A href="http://www.netscape. com">
Кодовое слово, стоящее в начале URL, обозначает так называемую схему доступа. Она определяет тип сервера, доступный при помощи данной ссылки. Для пользователя это представляется как доступ к одной из разновидностей Интернета. В этом смысле можно сказать, что Интернет — это как бы несколько сетей в одной. У каждой из этих частных сетей существуют свои правила доступа, достоинства, недостатки, свои приверженцы и противники. Но все пользователи используют одни и те же каналы связи. Похожая ситуация наблюдается и в обычных телефонных сетях. Они могут служить для связи голосом, передачи факсов, межкомпьютерной связи и т. д.
33. Таблицы. Тэги <table>, <tr>, <td>, <тн>, <caption>. Параметры align, border, width, valign, bordercolor, bgcolor, nowrap, cols, frame, rules. Примеры использования.
Таблицы являются очень удобным средством форматирования данных на Web-странице. Основное удобство заключается в том, что браузер берет на себя заботу о прорисовке рамки таблицы. Размер рамки может быть автоматически согласован с размером окна просмотра в браузере и, разумеется, с размером находящихся в ячейках таблицы строк текста и рисунков. Кроме того, таблицы позволяют решать чисто дизайнерские задачи: выравнивать части страницы друг относительно друга, размещать рядом рисунки и текст, управлять цветовым оформлением и т. д. При создании таблиц используется принцип вложения: внутри основного элемента таблицы (TABLE) создается ряд элементов, определяющих строки (TR), а внутри этих элементов размещаются элементы для описания каждой ячейки в строке (TD.TH). Чтобы разобраться в структуре существующей таблицы или создать новую таблицу, необходимо помнить, что последовательность элементов описывает таблицу сверху вниз и справа налево. Например, если после элемента TABLE указан элемент TR, это означает, что начинается описание новой строки таблицы. Все, что расположено за этим элементом, будет размещено в одной строке (справа налево). Это может быть последовательность элементов TD (ячеек), другая таблица и т. д. После того как встретится новый элемент TR, начнется описание следующей строки, и т. д. до конца таблицы (тега </table>).
<TABLE> </table>
Внешний элемент таблицы. Он позволяет задавать общие свойства таблицы и отделяет структуру таблицы от остальной части Web-страницы. Рассмотрим атрибуты этого элемента. Большинство атрибутов могут использоваться и в других элементах таблицы.
Таблицу можно выровнять по горизонтали при помощи атрибута align:
align="left" — влево;
align="center" - по центру;
align=" right" — вправо.
Ширину таблицы можно задать точно в пикселах или в процентном отношении к ширине страницы в окне браузера. Например:
width=400
width=50%
<CAPTION> </caption>
Элемент для задания заголовка таблицы. Несмотря на то что этот элемент располагается внутри элемента TABLE, заголовок выводится на экране вне рамки таблицы. Положением заголовка можно управлять:
align="top" — заголовок над таблицей;
align="bottom" — заголовок под таблицей;
align="left" — заголовок вверху и выровнен влево;
align=" right" — заголовок вверху и выровнен вправо.
<TR>
Элемент, создающий строку таблицы. Он не имеет конечного тега. Строка заканчивается там, где начинается следующая, то есть следующий элемент TR. Внутри элемента располагаются элементы ТН и TD, определяющие одиночные ячейки. Для выравнивания содержимого всех ячеек в строке можно использовать хорошо известный нам атрибут align и присваивать ему значения left, center и right. Кроме этого, содержимое ячеек можно выравнивать по вертикали:
valign="top" - по верхнему краю;
valign="center" - по центру;
valign="bottom" — по нижнему краю.
<TH>
Элемент ячейки, которая является заголовком столбца или строки таблицы. Этот элемент должен располагаться внутри элемента TR. Ячейка-заголовок отличается от обычной тем, что браузер выводит текст внутри нее выделенным (как правило, полужирным) шрифтом. Для элемента ячейки предусмотрено несколько атрибутов.
Если в ячейку введено большое количество текста, браузер разбивает его на строки так, чтобы сохранить требуемую конфигурацию таблицы. Конфигурацию может определять заданная фиксированная ширина таблицы, необходимость согласовать размер таблицы и области просмотра, заданная ширина ячейки.
Хорошо известный нам атрибут align используется и для одной ячейки. Он может принимать значения left (выравнивание по левому краю), center (выравнивание по центру) и right (выравнивание по правому краю). Обычно по умолчанию используется выравнивание влево. Элемент ТН в этом смысле исключение. Он обеспечивает центрирование текста, если атрибут align отсутствует.
Для элемента ТН можно указать атрибут valign таким же образом, как и для элемента TR.
Размеры ячеек можно задавать точно:
width=ширина height=высота
При помощи атрибута nowrap (он не имеет параметров) можно запретить форматирование текста. В этом случае в ячейке будет создана одна строка, а таблица может уйти за край окна.
Атрибуты rowspan и colspan позволяют создавать ячейки, которые в несколько раз больше других ячеек таблицы. Иными словами, ячейки в таблице можно объединять. При задании атрибута
rowspan=n и условии, что п>1, соответствующая ячейка займет не одну, а n строк, и, соответственно, будет иметь размер в n раз больший, чем обычная ячейка данного столбца.
Аналогично, при помощи атрибута colspan можно создавать ячейки, расположенные сразу в нескольких столбцах.
<TD>
Этот элемент определяет обычную ячейку таблицы. Для него допустимы те же
атрибуты, что и для элемента ТН.
Оба элемента — ТН и TD — могут не иметь конечных тегов. Функцию конечного тега выполняет следующий элемент, который определяет структуру таблицы.
По умолчанию браузер отображает рамку таблицы темно-серым цветом. Чтобы изменить цвет рамки надо применить атрибут BORDERCOLOR.
Для управления видом рамки используются два атрибута. На рамке можно различить фронтальную и боковую наклонную грани.
Шириной боковой грани управляет атрибут:
border=ширина
При задании нулевого значения для этого атрибута рамка исчезает совсем. Шириной фронтальной грани управляет атрибут:
сеllspacing=ширина
Если значение этого атрибута равно нулю, рамка получается тонкой, заостренной. Для всех ячеек таблицы можно задать размер пустого пространства, окружающего данные в ячейках:
cellpadding=число_пикселов
или
cellpadding="15%"
Задание этого атрибута делает ячейки больше. Между рамкой таблицы и данными всегда сохраняется определенное расстояние. В некоторых случаях это позволяет улучшить восприятие таблицы, сделать текст в ячейках легко читаемым. Для всей таблицы может быть задан цвет фона:
bgсоlor="Цвет"
bgcolor=#RRGGBB
Вместо цвета допускается использовать рисунок:
background="Файл"
Атрибуты bgcolor и background можно указывать и с другими элементами таблицы, кроме элемента CAPTION.
Атрибут frame (используемый только для элемента TABLE) позволяет задать вид рамки таблицы:
frame="параметр"
Существуют следующие стандартные параметры:
• void — рамка отсутствует;
• above — верхняя сторона рамки;
• below— нижняя сторона рамки;
• hsides — части рамки сверху и снизу;
• vsides — части рамки слева и справа;
• lns — левая часть рамки;
rhs — правая часть рамки;
border или box — рамка показана полностью.
Разумеется, если атрибут frame отсутствует, рамка вокруг таблицы выводится целиком.
Атрибут rules определяет вид сетки таблицы внутри, то есть между ячейками. Он тоже имеет несколько параметров:
попе — сетка отсутствует;
groups — сетка вокруг групп ячеек;
rows — горизонтальные линии между строками;
cols — вертикальные линии между колонками;
all — обычная сетка.
Существует атрибут комментария к таблице. Его текст не выводится на экран и может воспроизводиться только специальными программными средствами (например, программой-синтезатором речи):
summary="Текст комментария"
Допустимые стандартные атрибуты: id, class, lang, dir, title, style, атрибуты событий.
Выравнивание данных в ячейках
Существует набор атрибутов, предназначенных для выравнивания данных в ячейках таблиц. Атрибут align позволяет выравнивать данные в ячейках по горизонтали. Он принимает следующие значения:
left — выравнивание влево;
right — выравнивание вправо;
center — центрирование.
Атрибут valign позволяет выравнивать текст по вертикали. Значения могут быть такие:
top — выравнивание по верхнему краю ячейки;
bottom — выравнивание по нижнему краю ячейки (не всегда работает);
center — выравнивание по центру;
baseline — выравнивание по первой строке.
Для примера можно продемонстрировать использование значения baseline:
<TR valign="baseline"> <ТD>Строка 1<br>Строка 2 <ТD>Ячейка 2
Здесь первая ячейка содержит две строки текста, а вторая — одну. С помощью атрибута valign строки Строка 1 и Ячейка 2 будут расположены на одном уровне.
34. Фреймы. Тэги <FRAMESET>, <frame>, <iframe>. Параметры cols, rows, frameborder, framespacing, src marginheight, marginwidth, noresize, scrolling. Примеры использования.
<FRAMESET> <FRAME> </frameset>
Фреймы — это области, которые создаются в окне браузера для одновременной демонстрации нескольких документов. Не все браузеры позволяли разделять область просмотра на части, но эта идея завоевала всеобщее признание. Новые версии браузеров поддерживают фреймы в обязательном порядке. При создании страниц с фреймами разрабатывается несколько Web-страниц. При этом HTML-файлы отличаются по типам. Документы раскладки (layout) используются для создания структуры окна, то есть для описания того, как оно должно быть разделено. Документы содержания (content) предназначены для заполнения информацией каждой из областей.
Достоинства и недостатки фреймов
Достоинства:
фреймы одновременно отображают различную информацию в пределах одного окна;
используя фреймы, можно постоянно отображать какую-нибудь информацию (например логотип), не включая ее в каждую страницу сайта;
можно гибко построить навигацию по сайту.
Недостатки:
главное достоинство фреймов (отображение различной информации в пределах одного окна) является их же и недостатком, т.к. доступная область Вэб-страницы существенно сужается;
при создании фрейма правильно выбрать его размер часто бывает затруднительно. Таким образом, пользователь должен постоянно пролистывать фрейм при помощи полос прокрутки, что может очень быстро надоесть;
при низком разрешении экрана монитора объем видимой информации значительно уменьшается;
ну и самый неприятный недостаток - многие поисковые системы и каталоги отказываются регистрировать страницы, использующие фреймы.
Еще одним из недостатков фреймов является тот факт, что некоторые браузеры не умеют обрабатывать фреймы. При этом пользователь видит перед собой пустой экран. Для того, чтобы не вводить пользователя в заблуждение служит тэг <NOFRAMES>. Текст, помещенный между открывающим и закрывающим тэгом, отображается в случае невозможности отображения фрейма.
Горизонтальное деление экрана задается при помощи атрибута rows, а вертикальное — при помощи атрибута cols. Значения атрибутов могут быть выражены в пикселах или процентах. Кроме того, используется символ * для обозначения оставшейся части экрана. Приведем несколько примеров:
• cols=50%, 50% — деление области просмотра по вертикали пополам (принцип программы Norton Commander);
• cols=25%, 75% — левая вертикальная область в три раза уже правой. Такой стиль избрали многие фирмы, имеющие свои сайты в Интернете;
• rows=150, 30%, * —для верхней горизонтальной области отведено 150 пикселов, для средней — тридцать процентов доступного пространства, а для нижней — все, что останется;
• cols=*, 4* — стиль для любителей головоломок. Правая вертикальная область в четыре раза шире левой. Эту формулу можно записать и так: cols=20%, 80%.
Вторым этапом является подготовка отдельных HTML-файлов для каждой области. Они создаются по таким же правилам, что и другие гипертекстовые документы. Нужно только учитывать размер области, в которой они будут демонстрироваться. До тех пор, пока эти файлы не будут созданы, открывать документ раскладки в браузере не имеет смысла: вы ничего не увидите. Кстати, из этого следует одна особенность общения с Интернетом. Если вы набрели на сайт с фреймами и хотите заполучить в свою личную папку понравившийся документ, не пытайтесь сохранять основной HTML-файл. Вместо этого просмотрите его в режиме источника и найдите ссылку на конкретный документ содержания. Затем загляните в папку кэша, где последний и должен находиться.
В документе раскладки секция FRAMESET используется вместо секции BODY.
Атрибуты элемента <FRAME>
Внутри элемента FRAMESET должна быть создана ссылка на каждый документ содержания, входящий в сложную страницу. Кроме того, каждый элемент FRAME полезно снабдить именем с помощью атрибута name. В результате элемент FRAME может выглядеть так:
<FRAME src="Имя файла.htm" пате="имя фрейма">
После того как все страницы загружены, пользователь имеет возможность передвигать границы фреймов при помощи мыши. Атрибут noresize запрещает делать это для определенного фрейма.
Атрибут scrolling управляет прокруткой внутри одной области. Он может принимать значения YES (полосы прокрутки создаются в обязательном порядке), N0 (прокрутка запрещена) и AUTO (полосы прокрутки появляются, когда необходимо). Если этот атрибут отсутствует, браузер создает полосы прокрутки для тех документов, которые не умещаются целиком в отведенных им областях. Запретив прокрутку, можно создать так называемый баннер.
Значением атрибута longdesc является ссылка на другой файл (URL). Таким способом для фрейма создается описание любого объема. Это своего рода альтернатива использованию стандартного атрибута title, при помощи которого обычно задается короткий текстовый комментарий.
При помощи атрибута frameborder указывается, нужна или нет рамка вокруг фрейма. Значение 1 создает рамку, значение 0 — отменяет. Если необходимо убрать границу между фреймами, надо учитывать, что она создается рамками двух смежных областей.
Атрибут marginheight задает величину отступа страницы от верхнего и нижнего краев фрейма. Значение указывается в пикселах, например:
marginheight="75" Другой похожий атрибут, marginwidth, создает поля слева и справа, например:
marginwidth="10"
<IFRAME> </iframe>
Этот элемент позволяет создать на странице область с полосами прокрутки (inline frame) для демонстрации содержимого другой страницы. Шаблон для использования элемента (просмотра файла Имя файла, htm) такой:
<IFRAME src="Имя файла.htm" width="nnn" height="mmm">
Ваш броузер не поддерживает фреймы. Эту страницу можно просмотреть
<А href="Имя файла.htm">отдельно. </а>
</iframe>
Атрибуты width и height определяют ширину и высоту фрейма соответственно. Если атрибуты не указаны, используется окно размером 300х150 пикселов.
Атрибут scrolling управляет полосами прокрутки и может иметь следующие значения:
• auto — браузер определяет необходимость показа полос;
• yes — показ полос прокрутки (вертикальной — обязательно);
• no — без полос прокрутки.
FRAMESPAСING=x - отступ от края
Задает дополнительное пространство между фреймами в пикселах.
<FRAMESET framespacing="{Дополнительное пространство между фреймами}">
Значение по умолчанию 2.
35. Формы. Тэги <form>, <input>, <select>, <OPTION>, <TEXTAREA>. Параметры action, method, type, NAME, VALUE, ROWS, cols. Значения radio, checkbox, text, password, SUBMIT, BUTTON, RESET. Примеры использования.
Предполагается, что форма должна содержать определенное число элементов управления: поля ввода, переключатели, кнопки, флажки и т. д. Каждый элемент управления создается при помощи одного из элементов HTML. Для таких элементов предусмотрены атрибуты, влияющие на работу формы.
Большинство элементов формы может принимать определенные значения. Например, для поля ввода это может быть текст, а для переключателя — номер элемента, который выбран пользователем. Для доступа к этим значениям со стороны программы необходимо использование атрибута name.
В момент активизации формы часть элементов может иметь значения. В текстовое поле может быть введена строка, переключатели могут иметь подписи и т. д.. Для задания этих значений используется атрибут value.
< FORM ></form >
Этот элемент необходим для построения достаточно сложных форм. После заполнения формы и подтверждения ввода со стороны пользователя, введенная информация пересылается на сервер и обрабатывается при помощи- CGI-программы, связанной с формой.
Атрибут action должен указывать на имя программы, например:
<FORM action="http://www.название.домен/имя программы" method="post">
Элементы формы
</form>
Одним из вариантов обработки формы может быть пересылка данных по электронной почте:
action="mailto:Адрес@cepвep. домен"
С помощью атрибута method можно задать протокол для пересылки данных на сервер. Протокол GET используется по умолчанию, но в большинстве случаев он не удовлетворяет разработчиков, поэтому чаще используется протокол POST.
Атрибут enctype позволяет указать способ кодирования содержимого формы. Форму заполняют разные пользователи, поэтому для нее предусмотрен атрибут, который позволяет определить список допустимых кодировок:
accept-charset="список кодировок"
Можно также определить список допустимых типов данных:
accept="список типов данных"
Большинство форм снабжаются кнопками, которые позволяют очистить (reset) форму или подтвердить (submit) правильность ее заполнения и отослать данные. Чтобы определить программы-сценарии, которые должны выполняться после указанных действий пользователя, существуют два атрибута событий
onsubmit и onreset.
<INPUT>
Этот элемент позволяет создавать различные части формы, такие как флажки, переключатели, поля ввода. Элемент не имеет конечного тега, так как все параметры задаются при помощи атрибутов. Вид элемента определяет атрибут type:
type="text" — создание поля ввода, в котором можно автоматически разместить произвольный текст, используя атрибут value;
type="password" — создание поля для ввода пароля, причем введенная информация отображается звездочками;
type="checkbox" — создание флажка;
type="radio" — определение одного переключателя. Для создания группы переключателей необходимо использовать несколько элементов INPUT. Вот пример группы из трех переключателей:
<
НЗ>
Переключатели </h3>
<INPUT type="radio" name="S001" value="Первый">
<INPUT type="radio" name="S001" value="Второй">
<INPUT type-"radio" name="S001" value="Третий" checked>
Атрибут checked определяет, какой из переключателей должен быть выбран по умолчанию.
type="button" — создание кнопки произвольного назначения;
type="submit" - создание кнопки, щелчок на которой подтверждает ввод информации в форму. Атрибут value используется для определения надписи на кнопке;
type=" reset" — тоже кнопка, но для отмены ввода данных в форму;
type=" image" — создание кнопки с рисунком. Для указания графического файла используется атрибут src. Атрибут align предназначен для позиционирования кнопки с рисунком. Значения атрибута уже неоднократно упоминались: bottom, left, middle, right, top. Пользоваться этим атрибутом в данном случае не рекомендуется, так как не все браузеры его поддерживают;
type="file" — средство выбора файла для присоединения к форме. Пользователю предлагается записать имя файла в поле ввода. Кроме того, браузер автоматически создает рядом с полем ввода кнопку Обзор, которая позволяет запустить стандартный (для операционной системы) диалог выбора файлов;
type="hidden" — скрытый от пользователя элемент. Такие элементы используются для того, чтобы включить в набор данных формы некую фиксированную информацию. По сути, это определение имени переменной и ее значения.
Остальные атрибуты необходимы для определения свойств элемента. Многие из них являются обязательными, так как обеспечивают обработку данных формы на стороне сервера.
Атрибут name должен присутствовать во всех элементах INPUT, кроме кнопок подтверждения и сброса. Значение этого атрибута определяет имя поля формы, то есть блока данных, введенных в это поле. Программа сервера по этому имени может выделить необходимые данные.
Область применения атрибута value нам уже известна. Значение атрибута задает значение по умолчанию для поля ввода или определяет надпись на кнопке. Выше было показано, как с помощью атрибута checked создать группу переключателей. Точно таким же способом этот атрибут может быть использован и для флажков. Его наличие показывает, что флажок должен быть установлен по умолчанию. В отличие от переключателей, одновременно может быть установлено любое количество флажков.
Атрибут size позволяет задать длину поля ввода. Длина выражается в символах, но эта величина может быть задана только приближенно. Чтобы разместить в поле ввода определенное количество символов, потребуется подбор значения атрибута. При этом никто не может дать гарантию, что все браузеры обеспечат требуемую длину строки, а не меньшую. Таким образом, длину поля ввода необходимо выбирать с запасом.
Атрибут maxlenght может быть использован двумя способами. Во-первых, он определяет максимальную длину строки, которая может быть записана в поле ввода. Во-вторых, с его помощью можно ограничить размер файла, присоединяемого к форме.
Атрибут readonly позволяет создать элемент, недоступный для редактирования. Атрибут usemap (см. выше раздел «4.2. Рисунки и карты») может использоваться, если в форме создается карта.
Так же, как и в FORM, в элементе INPUT можно указывать атрибут accept. Допустимые общие атрибуты: accesskey, tabindex, readonly, disabled. Стандартные атрибуты: id, class, lang, title, dir, style, атрибуты событий.
Используя элементы FORM и INPUT, можно создать объект, который заменит аналогичный объект, созданный на основе элемента ISINDEX. Приведенный ниже код выполняет те же функции, что и код, посвященный элементу ISINDEX (см. рис. 4.3_1):
<
FORM
action" действие"
method="post">
<P>Строка для ввода критерия поиска <BR>
<INPUT type="text"></form>
<SELECT> <OPTION> </select>
Элемент SELECT предназначен для создания списка или меню на гипертекстовой странице, а элемент OPTION — для создания пункта списка. Пояснить действие этих элементов поможет простой фрагмент, приведенный ниже:
<
SELECT>
<OPTION value =а>Первый
<OPTION value =Ь>Второй
<OPTION value =с>Третий
<OPTION value=d>Четвертый
</select>
В результате мы получим список, показанный на рис. 4.6. Оба элемента, создающие список, имеют собственные атрибуты.
Атрибуты элемента SELECT могут быть следующими. Атрибут name определяет имя меню (см. выше раздел «Общие атрибуты форм»). При помощи атрибута multiple (который не имеет значений) пользователю разрешается выбрать сразу несколько пунктов списка. Атрибут size определяет количество видимых на экране пунктов списка. Когда атрибут size отсутствует, список выглядит обычным образом: вначале видна только первая строка, а щелчок на кнопке со стрелкой раскрывает список. Если значение атрибута задано, то список не раскрывается, а прокручивается, причем пользователь видит только указанное количество строк.
Элемент OPTION имеет другие атрибуты. Selected (без значений) определяет, какой из пунктов списка должен быть выбран по умолчанию, то есть при загрузке страницы. В списке только один из элементов OPTION может быть помечен таким способом. Атрибут value необходим для обработки данных на стороне сервера. Выбранный в списке пункт характеризуется значениями возвращенных атрибутов name и value.
<TEXTAREA> </textarea>
При помощи этого элемента создается область для ввода или просмотра текста. На рис. 4.7 показан пример такой области, созданный при помощи следующей конструкции:
<
Н2>Элемент
TEXTAREA
<TEXTAREA name="text001" rows=5 cols=30>
Область для ввода текста
</textarea></h2>
Размеры области задаются атрибутами rows (количество строк) и cols (количество столбцов). Назначение атрибута name такое же, как и в предыдущих случаях. Подобно элементу INPUT, элемент TEXTAREA может иметь атрибут readonly. Это позволяет создать элемент, недоступный для редактирования.
Элементы SELECT и TEXTAREA могут быть использованы не в составе формы, а как самостоятельные детали Web-страницы. Их применение оправдано в тех случаях, когда надо увеличить плотность размещения данных. При помощи элемента SELECT можно создавать списки, которые получаются более компактными, нежели стандартные списки. Область ввода текста также поможет сэкономить место на странице за счет того, что сколь угодно большой текст будет прокручиваться в окне фиксированного размера.
36. Идентификация страниц. Тэг <META>. Параметры name, content. Значения Author, Description, Keywords. Примеры использования.
<МЕТА>
Секция заголовка может содержать несколько элементов МЕТА, каждый из которых отвечает за определенный набор параметров. Использование элементов МЕТА не является обязательным, но некоторые настройки могут быть весьма важны. Так, например, известно, что браузер в некоторых случаях способен автоматически определить вид кодировки страницы. Пользователь, работая с браузером, может выбрать в меню определенную кодировку. Чтобы исключить неопределенность при просмотре конкретной страницы, на ней целесообразно разместить указание на кодовую страницу. Для документов в кодировке Windows оно должно быть таким:
<МЕТА http-equiv="Content-Type" content="text/html; charset=windows-1251">
Каждый элемент МЕТА содержит два основных атрибута, первый из которых определяет тип данных, а второй — содержание. Вот несколько примеров meta-данных.
• Дата, обозначающая «срок годности» документа:
name="Expires" content="Дата"
• Адрес электронной почты:
name="Reply-to" content="Имя@Адрес"
• Имя автора Web-страницы:
name ="Author" content=" Имя автора"
• Набор ключевых слов для поиска:
name="Keywords" content=" слово1, слово2, словоЗ ..."
• Краткое описание содержания Web-страницы:
name="Description" content="Содержание страницы"
• Описание типа и характеристик Web-страницы:
name="Content-Type" content ="Описание страницы"
• Указание приложения, в котором была создана Web-страница:
name="Generator" content="Название HTML-редактора"
Здесь и далее при описании элементов и их атрибутов курсивом выделены фрагменты, которые должны быть заполнены пользователем по его усмотрению. Атрибут name используется приложением-клиентом для получения дополнительной информации о Web-страницах и их упорядочения. Этот атрибут часто заменяют атрибутом http-equiv. Он используется сервером для создания дополнительных полей при выполнении запроса.
