Создание Web-страниц

Основные рекомендации по планированию Web-сайта. Ввод и форматирование текста. Редактирование абзацев, списков и заголовков. Особенности настройки цвета ссылки. Изучение динамических кнопок и рисунков. Проведение исследования гиперссылок и закладок.

Рубрика Программирование, компьютеры и кибернетика
Вид методичка
Язык русский
Дата добавления 28.11.2021
Размер файла 1,0 M

Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже

Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.

Дать новой странице имя и заголовок, отличные от уже существующих на сайте, и затем нажать кнопку “Сохранить” (Save). Новая страница будет сохранена, после чего появится диалоговое окно “Сохранить как” (Save As) для сохранения фреймовой страницы целиком (в окне пред-варительного просмотра эту страницу будет окружать широкая синяя рамка).

Дать фреймовой странице имя и заголовок, отличные от уже существующих на сайте и нажать кнопку “Сохранить” (Save). Фреймовая страница будет сохранена.

1.4 Контрольные вопросы

Абсолютные и относительные ссылки;

Гиперссылки: создание, назначение;

Чем отличается закладка от гиперссылки;

Для чего нужны динамические кнопки;

Каким образом можно вставить фоновый звук в Web-документ;

Форматирование абзацев. Основные принципы;

Что необходимо сделать для загрузки файла используя FTP;

Как вставить счетчик посещений страницы.

1.5 Тесты

1) Что такое абсолютные ссылки?

а) ссылка содержит полный адрес к файлу;

б) в ссылке показан только путь к файлу(/My Webs2/format.htm);

2) Что такое относительные ссылки?

а) в ссылке показан полный адрес к файлу;

б) в ссылке показан только путь к файлу(/My Webs2/format.htm);

в) например, адрес (http://www.peachpit.com/books/ K5914.htm).

3) Гиперссылки: назначение?

а) ссылки могут указывать на другой документ, специальное место данного документа;

б) выполнять некоторые функции, например запрашивать файл по FTP-протоколу;

в) служат для выделения текста;

г) нужны для анимации текста при наведении на неё курсора мыши.

4) Чем отличаются внутренние гиперссылки от внешних?

а) внутренние гиперссылки содержат полный путь внутри сервера;

б) внутренние гиперссылки содержат полный путь к документу с указанием конкретного участка текста через знак (#);

в) внешние гиперссылки содержат полный путь к документу без указания протокола передачи данных.

5) Для чего нужны динамические кнопки?

а) динамические кнопки позволяют применить ряд интересных эффектов, которые будут активизироваться при наведении указателя мыши посетителями сайта. Например, внешний вид кнопки может изменяться;

б) динамические кнопки позволяют использовать динамическое отображение страниц.

6) Что необходимо сделать для загрузки файла, используя FTP;

а) подать заявку системному администратору;

2. Лабораторная работа №2

Создание простейших Web-страниц с использованием HTML. Создание ссылок. Форматирование текста

2.1 Цель работы

Изучение основ создания HTML-документов. Создание HTML-документа с использованием HTML-тэгов. Логическое и физическое форматирование текста. Использование ссылок.

2.2 Порядок выполнения работы

Создать новый HTML документ с использованием какого-либо обычного или специализированного текстового редактора. В тексте должны содержаться тэги необходимые для любого HTML документа (<HTML>,<BODY>). Добавить текст по определенной теме. Сохранить данный документ в свою папку вместе с ранее сохраненными документами под названием “index.html”.

Задать заголовок, отображаемый в строке заголовка окна браузера. Текст строки заголовка - фамилия на русском языке. Использовать при этом тэг <TITLE>.

Установить необходимые цвета фона и текста документа. Для уста-новки цветов документа используются параметры “BGCOLOR”, “TEXT”, внутри открывающего тэга <BODY>.

Написать произвольный абзац текста самым крупным шрифтом. В данном случае следует использовать тэги-контейнеры отвечающие за размер шрифта, например <H2>. Осуществить выравнивание различных абзацев (отцентрировать, прижать вправо, влево, выровнять по ширине).

Произвести логическое форматирование текста как небольшого фрагмента программного кода с выделением.

Произвести физическое форматирование текста, как небольшого фрагмента моноширинным шрифтом, с подчеркиванием и с эффектом мигания.

Написать определения трех любых понятий данного курса различными цветами и гарнитурами (Arial, Times, моноширинный шрифт). Сам термин должен быть выведен полужирным курсивом с подчеркиванием. До-биться данного эффекта можно использованием тэга <FONT> с параметрами.

Добавить в Web-документ пять видов ссылок.

Провести эксперименты с Escape-последовательностями. При этом не стоит забывать, что данные последовательности чувствительны к регистру.

К сдаче лабораторной предоставляются: работающая страница на сервере с комментариями каждого тэга и его свойств (атрибутов) в исходнике.

2.3 Методические указания

2.3.1 Общие положения языка HTML

Язык HTML (Hypertext Markup Language, язык разметки гипертекста) -- это язык структурной разметки, используемый для создания Web-страницы. HTML-документы могут просматриваться различными типами Web-браузеров. Когда документ создан с использованием HTML, Web-браузер может интерпретировать HTML для выделения различных элементов документа и первичной их обработки. Использование HTML позволяет форматировать документы для их представления с использованием шрифтов, линий и других графических элементов на любой системе, их просматривающей.

Web-страницы могут быть созданы с помощью:

обычного текстового редактора;

редактора, способного сохранять текст в формате HTML;

специализированного редактора;

специализированной системы.

HTML-документы сохраняются на диске как обычные текстовые документы в формате ANSI. Для распознавания Web-страниц по их именам общепринято обозначать такие файлы использованием расширений .HTM (для Windows 3.1) или .HTML (для Windows 95/98/Me/NT/XP, Macintosh и Unix).

Кроме полезного текста в HTML-документах используются специальные управляющие буквенно-цифровые коды (Тэги), помещенных в угловые скобки <B>, <HTML>, <IMG>, <HR>. Большинство элементов состоят из пар тэгов - открывающего и закрывающего. Открывающий тэг - это просто мнемонический символ элемента, заключенный в угловые скобки <B>. Закрывающий тэг идентичен открывающему, за тем исключением, что перед символом ставиться прямая наклонная черта </B>. Хотя некоторые элементы не требуют ставить закрывающий тэг, потому что он ничего не окружает <BR>.

Структура тэга в общем, виде имеет следующий вид:

<ТЭГ параметр1=значение1...>

текст, на который распространяется действие тэга </ТЭГ>

или

<ТЭГ параметр1=значение1...>

текст

другие конструкции

При интерпретации тэгов браузер не делает различия между строчными и прописными буквами. Поэтому сами тэги можно набирать на любом регистре. Зачастую параметр (атрибут) является необязательной величиной и его можно пропускать.

2.3.2 Структура HTML-документа

Когда Web-браузер получает документ, он определяет, как документ должен быть интерпретирован. Самый первый тэг, который встречается в документе, должен быть тэгом <HTML>. Данный тэг сообщает Web-браузеру, что документ написан с использованием HTML. Минимальный HTML-документ будет выглядеть так:

<HTML> ...тело документа... </HTML>

В общем виде Web-документ имеет следующую структуру:

<HTML>

<HEAD> <TITLE>Название документа </TITLE>

</HEAD>

<BODY>

… тело документа

</BODY> </HTML>

<HTML> и </HTML> заключают внутри себя все элементы HTML-кода, указывая, что используется язык HTML.

<HEAD> и </HEAD> обозначают заголовок Web-документа. Как правило, заголовок содержит название документа, информацию для индексирования и некоторые общие установки для данного документа. Тэг заголовочной части документа должен быть использован сразу после тэга <HTML> и более нигде в теле документа.

<BODY> и </BODY> обрамляют оставшуюся часть документа (тело). Здесь размещается основная смысловая текстовая и графическая информация.

Разделение документа на заголовочную часть и тело имеет лишь смысловую нагрузку. Текст, приведенный в любой из этих частей, на экране выглядит совершенно одинаково.

Внутри контейнера <HEAD> может использоваться тэг <TITLE>, как показано выше. Большинство Web-браузеров отображают содержимое этого тэга в заголовке окна, содержащего документ и в файле закладок, если он поддерживается WEB-браузером. Заголовок документа не появляется при отображении самого документа в окне /5/.

Как любой язык, HTML позволяет вставлять в тело документа пояснительный текст (комментарии), который сохраняется при передаче документа по сети, но не отображается браузером. Синтаксис комментария следующий:

<!-- Это комментарий -->

Комментарии могут встречаться в документе где угодно и в любом количестве.

2.3.3 Форматирование текста

При выводе на экран текста браузер игнорирует дополнительные пробелы, символы табуляции и возврата каретки, пустые строки. Их можно использовать для того, чтобы сделать текст HTML-документа более легко читаемым, но для правильного его отображения на Web-странице следует использовать специальные тэги:

a) Цвета в HTML-документе.

Язык HTML определяет следующие типы цветов:

BGCOLOR (цвет фона для тела документа),

TEXT (цвет, используемый при выводе на экран текста из данного документа),

LINK (цвет, который будет использоваться при выводе на экран текста из еще не выбранных вами гипертекстовых связей),

VLINK (цвет, который будет использоваться при выводе на экран текста из уже проверенных вами гипертекстовых связей),

ALINK (цвет, которым будут выделяться в тексте гипертекстовые связки в тот момент, когда пользователь щелкает по ним клавишей мыши).

Существует две формы задания цвета: символьная (указывается название одного из предопределенных цветов) и цифровая (комбинация RGB: #RRGGBB).

Символьные идентификаторы основных цветов и их RGB-комбинации приведены ниже:

BLACK (#000000) -- черный,

SILVER (#C0C0C0) -- серебряный,

GRAY (#808080) -- серый,

WHITE (#FFFFFF) -- белый,

MAROON (#800000) -- темно-красный,

RED (#FF0000) -- красный,

PURPLE (#800080) -- темно-сиреневый,

FUCHSIA (#FF00FF) -- сиреневый,

GREEN (#008000) -- зеленый,

LIME (00FF00) -- ярко-зеленый,

OLIVE (#808000) -- оливковый,

YELLOW (#FFFF00) -- желтый,

NAVY (#000080) -- темно-синий,

BLUE (#0000FF) -- голубой,

TEAL (#008080) -- сине-зеленый,

AQUA (#00FFFF) -- ярко-голубой.

Атрибут, указывающий на цвет, может использоваться в тэгах <BODY>, <FONT>, <HR>, <MARQUEE>, <TABLE>.

б) Элементы форматирования на уровне блоков.

<P align=left|center|right|justify nowrap> текст </P> - разделяет два абзаца пустой строкой. Может не иметь пары </P>. Параметр ALIGN задает выравнивание информации. Применение параметра NOWRAP дает возможность писать текст без переноса слов. Для центрирования текста или графики можно использовать также контейнер <CENTER>.

<H1|H2|H3|H4|H5|H6 align=...> текст </H1|H2|H3|H4|H5|H6> -используются для выделения структурных частей текста. Каждый стиль заголовка имеет свой размер. Тэг <H1> имеет наибольший размер.

<HR align=... size=... width=... noshade> - предназначен для вычерчивания горизонтальной линии. Атрибут SIZE задает толщину линии в пикселях, WIDTH -- ее ширину в пикселях или процентах от ширины окна браузера. Атрибут NOSHADE позволяет представить линию без тени в виде простой темной полоски.

<BR> - вызывает переход на новую строчку без разрыва абзаца.

<WBR></WBR> - определяет место возможного (рекомендуемого) переноса (разрыва) строки.

<NOBR></NOBR> - заключает в себе текст, который не должен разбиваться на строки, даже если она выходит за границы экрана. Вместо этого браузер позволит горизонтально прокручивать текст.

<PRE></PRE> - , выводится браузером на экран как есть -- со всеми пробелами, символами табуляции и конца строки. Это очень удобно при создании простых таблиц.

<BLOCKQUOTE></BLOCKQUOTE> - предназначен для обозначения в документе цитаты из другого источника. Текст, обозначенный этим тэгом, отступает от левого края документа на 8 пробелов.

Рисунок 9 - Размеры шрифтов

Пример:

<p><font size="1">Шрифт размера 1</font></p> <p><font size="2"> Шрифт размера 2</font></p> <p><font size="3"> Шрифт размера 3</font></p> <p><font size="4"> Шрифт размера 4</font></p>

<p><font size="5"> Шрифт размера 5</font></p>

<p><font size="6"> Шрифт размера 6</font></p>

<p><font size="7"> Шрифт размера 7</font></p>

В браузере это будет выглядеть следующим образом:

в) Элементы логического форматирования текста.

<ABBR></ABBR> - Отмечает текст как аббревиатуру.

<ACRONYM></ACRONYM> - Так же, как и тэг <ABBR> используется для отметки аббревиатур. Этим тэгом рекомендуется отмечать так называемые акронимы, т.е. произносимые слова, состоящие из аббревиатур.

<CITE></CITE> - Используется для отметки цитат или названий книг и статей, ссылок на другие источники.

<CODE></CODE> - Отмечает свой текст как небольшой фрагмент программного кода.

<DEL></DEL> - Отмечает свой текст как удаленный.

<DFN></DFN> - Отмечает свой текстовый фрагмент как определение

<INS></INS> - Отмечает свой текст как вставку.

<EM></EM> - Используется для выделения важных фрагментов текста.

<KBD></KBD> - Отмечает текст как вводимый пользователем с клавиатуры.

<Q></Q> - Отмечает короткие цитаты в строке текста.

<SAMP></SAMP> - Отмечает текст как образец.

<STRONG></STRONG> - Используется для выделения важных фрагментов текста

<VAR> </VAR> - Отмечает имена переменных программы. г) Элементы физического форматирования текста

<B></B> - Отображает текст полужирным шрифтом.

<I></I> - Отображает текст курсивом..

<TT></TT> - Отображает текст моноширинным шрифтом.

<U></U> - Отображает текст подчеркнутым.

<STRIKE></ STRIKE> - Отображает текст подчеркнутым.

<S></S> - Отображает текст, перечеркнутым горизонтальной линией.

<BIG></BIG> - Отображает текст большего размера.

<SMALL></ SMALL> - Отображает текст меньшего размера.

<SUB></SUB> - Сдвигает текст ниже уровня строки и выводит его шрифтом меньшего размера.

<SUP></SUP> - Сдвигает текст выше уровня строки и выводит его шрифтом меньшего размера.

<BLINK></BLINK> - Отображает мигающий текст.

<BASEFONT> - Используется для указания размера, типа и цвета шрифта, используемого в документе по умолчанию

<FONT size=… color=... face=...> текст </FONT> - Указывает параметры шрифта.

size -- устанавливает размер шрифта, который будет использоваться текстом, содержащимся в пределах элемента font. Можно задать абсолютный размер шрифта, указав какое-либо целое число от 1 до 7. Для шрифта можно также указывать относительный размер, сообщая атрибуту целое число со знаком (это может быть size="+1" или size="-2").

color -- указывает цвет, которым будет выделен данный кусок текста. Цвета задаются в виде RGB-значения с шестнадцатеричной нотацией, либо выбирается один из стандартных цветов.

face -- задает гарнитуру шрифта.

2.3.4 Специальные тэги HTML

Тэг <ADDRESS> используется для выделения автора документа и его адреса (e-mail). Синтаксис:

<ADDRESS> Адрес-автора </ADDRESS>

Некоторые символы являются управляющими символами в HTML и не могут напрямую использоваться в документе:

левая угловая скобка "<"

правая угловая скобка ">"

амперсанд "&"

двойные кавычки """

Чтобы использовать данные символы в документе, необходимо заменить их escape-последовательностями: < - &lt; > - &gt; & - &amp; " - &quot;.

Существует большое количество escape-последовательностей для обозначения специальных символов ("&copy;" для обозначения знака © и "&reg;" для значка ®). Одной из особенностей является замена символов во 2-ой части символьной таблицы (после 127-ого символа) на escape-последовательности для передачи текстовых файлов с национальными языками по 7-битным каналам.

Escape-последовательности чувствительны к регистру: НЕЛЬЗЯ использовать &LT; вместо &lt;.

2.3.5 Ссылки

Гипертекстовые связи (ссылки) являются наиболее важным элементом Web-страниц. С их помощью делают документ связанным и структурированным, что позволяет пользователю получать необходимую ему информацию максимально быстро и удобно.

Ссылки могут указывать на другой документ, специальное место данного документа или выполнять другие функции, например, запрашивать файл по FTP-протоколу для отображения его браузером. URL (Universal Resource Locator) - универсальный способ адресации ресурсов в сети может указывать на специальное место по абсолютному пути доступа, или указывать на документ в текущем пути доступа, что часто используется при организации больших структурированных Web-сайтов. В URL после имени файла через # (диез) может указываться специальный маркер. Данный элемент является ссылкой на строку (точку) внутри HTML-документа /5/.

Ссылка состоит из двух частей. Первая из них -- это то, что видно на Web-странице; она называет указатель ссылки (anchor). Вторая часть, дающая инструкцию браузеру, называется адресной частью ссылки (URL-адрес). Когда происходит щелчок мышью по указателю ссылки, браузер загружает документ, адрес которого дается URL-адресом. Ниже рассмотрены правила построения отдельных элементов ссылок. Вторая часть ссылки является URL - адрес. Это не что иное, как адрес Web - страницы, которая будет загружена при щелчке мышью на указателе.

Ссылка осуществляется тэгом <A>. Тэг <A> имеет единственный параметр HREF, значением которого является URL-адрес. Этот тэг является контейнером, поэтому необходимо поставить закрывающий тэг </A>.

<А HREF = URL - адрес>Текстовый указатель ссылки</А>

Указатель может быть как относительным, так и абсолютным.

Относительные указатели удобны в использовании. Намного проще вста-вить только имя файла, а не весь длинный URL-адрес. Они также позволяет перемещать файлы в пределах сервера без больших изменений в межстраничной адресации.

URL-адрес, полностью определяющий компьютер, каталог и файл, называется абсолютным. В отличие от относительных, абсолютные указатели могут ссылаться на файлы, расположенные на других компьютерах.

Кроме ссылок на другие документы, часто бывает полезно включить ссылки на разные части текущего документа. Например, большой документ читается лучше, если он имеет оглавление со ссылками на соответствующие разделы. сайт абзац ссылка кнопка

Для построения внутренней ссылки сначала нужно создать указатель, определяющий место назначения. Например, если необходимо сделать ссылку на текст определенной главы документа, нужно разместить там указатель и дать ему имя при помощи параметра NAME тэга <A>. При этом параметр HREF не используется, и браузер не выделяет содержимое тэга <A>.

Пример:

<А NAME=chapter_5> </A>

Необходимо обратить внимание, что в приведенном примере отсутствует содержимое тэга <A>. Обычно именно так и делают, поскольку здесь нет необходимости как-то выделять текст, а требуется лишь указать местоположение.

После того как место назначения определено, можно приступить к созда-нию ссылки на него. Для этого, вместо указания в параметре HREF адреса документа, как это делалось ранее, поместим туда имя ссылки с префиксом #, говорящим о том, что это внутренняя ссылка.

Пример:

<А HREF="#chapter_5">Глава 5</A>

Теперь, если пользователь щелкнет кнопкой мыши на словах "Глава 5", браузер выведет соответствующую часть документа в окне просмотра.

Web-пространство является лишь частью сети Интернет. Другие ресурсы начали свое существование задолго до рождения WWW, поэтому накопили уже много достойной внимания информации и имеют достаточно большую аудиторию. Поэтому, разрабатывая свою персональную страницу или документ можно включить ссылки и на другие ресурсы.

Ресурсы Интернета весьма разнообразны по форме и содержанию. Хотя HTML предполагает возможность создания своих собственных версий этих ресурсов с помощью механизма обработки данных форм, есть более простые пути к взаимодействию с системами UseNet, Telnet, FTP, e-mail и другими. Например, можно создать документ с использованием различных тэгов форм, текстовых элементов и кнопкой для отправки электронного письма на необходимый адрес. Однако будет намного проще для связи указать лишь свой адрес электронной почты. В этом случае упрощается обновление страницы, которое не будет связано с изменениями форм. Кроме того, многие браузеры имеют встроенную поддержку некоторых ресурсов, что дает возможность сократить время на установление связи с ними.

Самой популярной деятельностью в Интернете является обмен электронными письмами. Пользователей этого ресурса намного больше, чем любого другого. Большинство современных программ для обмена электронными сообщениями имеют дружественный интерфейс и просты в использовании.

Создание ссылки на электронную почту так же просто, как и на другую страницу. Для этого вместо URL-адреса следует указать адрес электронной почты, предварив его словом mailto:.

Пример:

<A HREF="mailto:serg@mail.ru">Присылайте ваши отзывы</А>

Ссылки на другие ресурсы Интернета записываются аналогично.

Web - страница - http://sitename

e-mail - mailto:address

Newsgroup - news:newsgroupname

ftp - ftp://sitename

Gopher - gopher://sitename

WAIS - wais://sitename

Telnet - telnet://sitename

2.4 Контрольные вопросы

Что понимается под терминами закрывающий и открывающий тэги? Всегда ли они оба применяются?

Влияет ли регистр языка HTML на результат выполнения?

Каким тэгом можно внести комментарий в HTML?

Какой тэг позволяет изменить цвет фона HTML-документа?

Назначение тэга <HR>?

Назначение тэга <BIG>?

К каким изменениям приведёт применение тэга <ADDRESS>?

Как для построения внутренней ссылки создать указатель, опре-деляющий место назначения внутри документа?

Привести пример ссылки на электронную почту.

2.5 Тесты

1) Цвет, который будет использоваться при выводе на экран текста из еще не выбранных гипертекстовых связей?

а) ALINK;

б) VLINK;

в) LINK.

2) Тэг, вызывающий переход на новую строчку без разрыва абзаца?

а) <WBR>;

б) <HR>;

в) <P>;

г) <BR>.

3) Тэг, предназначенный для обозначения в документе цитаты из другого источника?

а) <ABBR></ABBR>;

б) <PRE></PRE>;

в) <BLOCKQUOTE></BLOCKQUOTE>;

г) <ACRONYM></ACRONYM>.

4) Тэг, отображающий текст моноширинным шрифтом? <STRIKE></ STRIKE>;

а) <U></U>;

б) <B></B>;

в) <TT></TT>.

5) Сдвигает текст ниже уровня строки и выводит его шрифтом меньшего размера?

а) <SMALL></ SMALL>;

б) <BLINK></BLINK>;

в) <STRIKE></ STRIKE>;

г) <SUB></SUB>.

6) Гиперссылки: создание?

а) <A HREF="mailto\serg@mail.ru">Присылайте ваши отзывы;

б) <А NAME=chapter_5> </A>;

в) <A HREF=My_Dok.html%ch_5><IMG SRC=map.gif></A>;

7) Выберите внутреннюю гиперссылки?

а) <A HREF=My_Dok.html%ch_5>;

б) <A HREF=My_Dok.html#ch_5>;

в) <A HREF=My_Dok.html,ch_5>;

3. Лабораторная работа №3

Meтaданные. Фреймы. Работа с FTP сервером

3.1 Цель работы

Познакомиться с назначением метаданных. Научиться использовать фреймы. Освоить работу с FTP-сервером.

3.2 Порядок выполнения работы

Открыть ранее созданный Web-документ. Проанализировать его содержимое. Выявить основные моменты, и подготовить информацию для заполнения метаданных. Используя описание, приведённое в методическом материале, заполнить метаданные страницы.

Создать Web-документ, состоящий из пяти или более фреймов. Для работы с фреймами необходимо будет создать или использовать не менее пяти страниц, каждая из которых будет в своей области отображения на главной странице.

Создать фреймовую структуру:

Сделать несколько ссылок, которые будут открывать какой-либо документ, и использовать в качестве области отображения вызванного документа, некоторый центральный (наибольший) фрейм. Провести эксперименты с параметром «TARGET».

Отредактировать свой Web-документ таким образом, чтобы у не скольких фреймов можно было поменять размеры при помощи мыши, а размеры остальных оставались фиксированными. Изменить толщину и цвет, рамок фреймов.

Подключиться к указанному FTP-серверу. Создать на нём свою папку, и скопировать в него ранее созданный Web-документ. Вывести Web-документ на просмотр через браузер.

К сдаче лабораторной предоставляются: работающая страница на сервере с комментариями каждого тэга и его свойств (атрибутов) в исходнике.

3.3 Методические указания

3.3.1 Метаданные

МЕТА - это наиболее популярный элемент разметки заголовка, более рас-пространен только элемент TITLE. Такое положение дел объясняется на-значением данного элемента разметки. МЕТА содержит управляющую информацию, которую браузер использует для правильного отображения и обработки содержания тела документа.

Впервые контейнер МЕТА был задействован при принудительной перезагрузке документа браузером через заголовок HTTP-сообщения. В заголовке HTTP-сообщения можно указать оператор refresh. Время, заданное как параметр этого оператора, определяет интервал в секундах, после которого браузер загружает документ, определенный атрибутом URL данного оператора. Впервые этот механизм был реализован на сервере CERN, но наибольшую популярность приобрел при использовании сервера WN (Web-сервер, который был разработан для платформы Unix (Linux).

В контейнере МЕТА подобный механизм реализуется следующим образом:

<МЕТА HTTP-EQUIV="Refresh" CONTENT="1; URL=refresh.html">

В данном случае через одну секунду после загрузки документа браузер должен инициировать загрузку страницы refresh.html.

Используя этот механизм, можно построить автоматически переза-гружаемую последовательность страниц. Для этого в заголовке каждой страницы из данной последовательности следует разместить соответствующий контейнер МЕТА.

<МЕТА HTTP-EQUIV="Refresh" CONTENT="1"; URL="refreshX.html">

Заглавная буква "X" в слове "refreshX.html" -- это цифра номера кадра. На странице нулевого кадра в этом месте следует указать на первый кадр (refreshl.html), на странице первого кадра -- на второй (refresh2.html).

В Windows 95 и Windows NT 4.0 с поддержкой таблиц UNICODE по-явилась возможность указывать тип кодировки документа -- CHARSET. К сожалению, на многих Unix-платформах этот механизм не работает, что часто приводит к ошибкам. Скептическое отношение поклонников Unix к этой возможности ничем не подкреплено, так как основная масса пользователей российской части Internet просматривает документы World Wide Web в Windows. Для перекодировки на стороне в заголовок документ необходимо включить МЕТА-тэг следующего вида:

<МЕТА HTTP-EQUIV="Content-type" CONTENT="text/html; CHARSET=windows-1251 ">

Приведенный выше пример показывает, как используются операторы заголовка HTTP-сообщения. Однако здесь тоже следует быть осторожным. Большинство российских Web-узлов используют в качестве HTTP-сервера Russian Apache. Эта модификация сервера поддерживает перекодировку документов "на лету" для правильного отображения на стороне клиента. Russian Apache сам вставляет в HTTP-заголовок (не путать с HEAD) директиву Content-type. Если в документе будет МЕТА-элемент с указанием типа кодировки, a Apache перекодировал содержание, то возможно несоответствие между указанным в МЕТА типом кодировки и реальной кодировкой содержания документа.

Кроме Content-type, можно указать и другие операторы. Например, запретить кэширование документа. Необходимость в этом возникает при частом обновлении документа или наличии в нем изменяющихся SSI-вставок. Для запрета кэширования достаточно вставить в заголовок METА - тэг вида:

<МЕТА HTTP-EQUIV="Pragma" CONTENT="no-cache">

Pragma -- это наследие HTTP 1.0. В новой версии протокола HTTP (HTTP 1.1) управление кэшированием осуществляется через оператор Cache-Control. Для получения такого же эффекта, как в случае с Pragma, и в заголовке HTML-документа достаточно указать:

<МЕТА HTTP-EQUIV="Cache-Contror CONTENT="no-cache">

Новый механизм управления кэшированием и хранением документа нa стороне клиента гораздо более гибок, чем в HTTP 1.0. Например, можно запретить хранение документа после пересылки:

<МЕТА HTTP-EQUIV="Cache-Control" CONTENT="no-store">

Точно так же можно задать время последней модификации (Last-Modified) или дату истечения актуальности документа (Expire).

С появлением роботов поисковых машин на МЕТА-тэг была возложена еще одна функция -- описание поискового образа документа. Наиболее последовательно это было впервые реализовано в Webcrawler. До этого в качестве поискового образа документа использовался либо весь список слов документа, либо слова первого абзаца.

Собственно, для описания документа используется два МЕТА-тэга. Один определяет список ключевых слов, а второй -- реферат (краткое содержание документа), который отображается в качестве пояснения к ссылке на документ в отчете поисковой машины о выполненном запросе. Контейнер TITLE здесь также используется в качестве названия документа.

Пример:

<ТIТLE>Создание Web - Страниц </TITLE>

<МЕТА NAME="description" HTTP-EQUIV="description" СОNТЕNТ="Лабораторный практикум Создание Web - Страниц. Тема: Заголовок HTML-документа. Элемент разметки МЕТА. Дается краткое описание основных способов применения контейнера МЕТА в заголовке HTML-документа. Рассматривается управление HTTP-обменом и индексирование документов.">

<МЕТА NAME="keywords" HTTP-EQUIV="keywords" СОNТЕNТ="учебный курс; Web-технология; web; технология; HTML;

язык гипертекстовой разметки; заголовок HTML-документа; заголовок;HTML; документ; контейнер; МЕТА; элемент; HEAD; разметка; методичка">

При индексировании такого документа содержимое контейнера TITLE и атрибутов CONTENT контейнеров МЕТА после фильтрации попадет в индекс поисковой машины и может быть использовано для составления запросов. Процесс фильтрации отбракует так называемые stop-слова и общие слова. Они не попадут в индекс поисковой машины. В частности, будут отбракованы предлоги или, если речь идет о тематическом поисковом индексе, например по технологиям World Wide Web, то в него не попадут: web, Web-технология и т.п.

МЕТА - тэгом пользуются и программы подготовки документов. Они размещают в нем свой идентификатор. В общем случае контейнер МЕТА выглядит следующим образом:

<МЕТА [name=имя] [НТТР-EQUIV=имя_НТТР-оператора] СОМТЕМТ=текст>

Практика показывает, что при индексировании можно указывать одновременно и атрибут NAME, и атрибут HTTP-EQUIV с одинаковыми значениями. Это связано с тем, что одни роботы индексирования анализирует содержание МЕТА - элемента по атрибуту NAME, а другие -- по атрибуту HTTP-EQUIV.

3.3.2 Фреймы

Фреймы -- достаточно мощный механизм представления информации на Web-страницах. С помощью фреймов экран разделяется на несколько прокручивающихся областей, в каждой из которых отображается содержимое отдельной страницы и даже отдельного Web-узла. Каждый фрейм, может иметь следующие свойства:

Каждый фрейм имеет свой URL, что позволяет загружать его независимо от других фреймов.

Каждый фрейм имеет собственное имя (параметр NAME), позволяющее переходить к нему из другого фрейма.

Размер фрейма может быть изменен пользователем прямо на экране при помощи мыши (если это не запрещено указанием специального параметра).

Данные свойства фреймов позволяют создавать продвинутые интерфейсные решения, такие как:

Размещение статической информации, которую автор считает необходимым постоянно показывать пользователю, в одном статическом фрейме. Это может быть графический логотип фирмы, авторское право, набор управляющих кнопок.

Помещение в статическом фрейме оглавления всех или части Web-документов, содержащихся на Web-сервере, что позволяет пользователю быстро находить интересующую его информацию.

Создание окна результатов запросов, когда в одном фрейме находится собственно запрос, а в другом результаты запроса.

Создание формы типа "мастер-деталь" для Web-приложений, обслуживающих базы данных.

Формат документа, использующего фреймы, внешне очень напоминает формат обычного документа, только вместо тэга BODY используется контейнер FRAMESET, содержащий описание внутренних HTML-документов, содержащий собственно информацию, размещаемую во фреймах/5/.

<HTML>

<HEAD>...</HEAD> <FRAMESET>...</FRAMESET> </HTML>

Однако, фрейм-документ является специфичным видом HTML-документа, поскольку не содержит элемента BODY и какой-либо информационной нагрузки соответственно. Он описывает только фреймы, которые будут содержать информацию (кроме случая двойного документа, который мы рассмотрим позже).

Общий синтаксис фреймов:

<FRAMESET COLS="value" | ROWS="value">

<FRAME SRC="URL1">

<FRAME SRC="URL2">

... </FRAMESET>

Общий контейнер FRAMESET описывает все фреймы, на которые делится экран. Можно разделить экран на несколько вертикальных или горизонтальных фреймов. Внутри контейнера могут находиться только тэг <FRAME>, вложенные контейнеры <FRAMESET> и <NOFRAME>, который позволяет строить двойные документы для браузеров, поддерживающих и не поддерживающих фреймы.

Данный тэг имеет два взаимоисключающих параметра: ROWS и COLS.

ROWS="список определений горизонтальных подокон". Данный тэг содержит описания некоторого количества подокон, разделенные запятыми. Каждое описание представляет собой числовое значение размера подокна в пикселях, процентах от всего размера окна или связанное масштабное значение. Количество подокон определяется количеством значений в списке. Общая сумма высот подокон должна составлять высоту всего окна (в любых измеряемых величинах). Отсутствие атрибута ROWS определяет один фрейм, величиной во все окно браузера.

COLS="список определений вертикальных подокон". То же самое, что и ROWS, но делит окно по вертикали, а не по горизонтали.

В качестве списка определений могут выступать:

Простое числовое значение определяет фиксированный размер подокна в пикселях. Это не самый лучший способ определения размера подокна, т.к. различные браузеры имеют различный размер рабочего поля, не говоря уже о различных экранных разрешениях у пользователя. Если все же используется данный способ описания размера, то настоятельно рекомендуется сочетать его с каким-либо другим, чтобы в результате точно получили 100 % -ное заполнение окна браузера.

Значение величины подокна в процентах от 1 до 100. Если общая сумма процентов описываемых подокон меньше или превышает 100, то размеры всех фреймов пропорционально увеличиваются или уменьшаются до суммы 100 %. Число со звездочкой. Вообще говоря, числовое значение в данном описании является необязательным. Символ "*" указывает на то, что все оставшееся место будет принадлежать данному фрейму. Если указывается два или более фрейма с описанием "*", или "*,*" то оставшееся пространство делится поровну между этими фреймами. Если перед звездочкой стоит цифра, то она указывает пропорцию для данного фрейма (во сколько раз он будет больше аналогично описанного чистой звездочкой). Описание "3*,*,*", говорит, что будет создано три фрейма с размерами 3/5 свободного пространства для первого фрейма и по 1/5 для двух других.

Примеры:

<FRAMESET COLS="50,*,50"> -- описывает три фрейма, два по 50 точек справа и слева, и один внутри этих полосок.

<FRAMESET ROWS="20%,3*,*"> -- описывает три фрейма, первый из которых занимает 20 % площади сверху экрана, второй 3/4 оставшегося от первого фрейма места (60 % всей площади окна), а последний 1/4 (20 % всей площади окна).

<FRAMESET ROWS="*,60%,*"> -- аналогично предыдущему примеру.

Тэги <FRAMESET> могут быть вложенными, т.е. например:

<FRAMESET ROWS="50%,50%">

<FRAMESET COLS="*,*" </FRAMESET> </FRAMESET>

Тэг FRAME описывает каждый фрейм в отдельности. Рассмотрим более детально каждый компонент.

<FRAME SRC="URL" NAME="frame_name" MARGINWIDTH="n1" MARGINHEIGHT="n2" SCROLLING=yes|no|auto NORESIZE>

Где SRC="URL" -- описывает URL документа, который будет отображен внутри данного фрейма. Если он отсутствует, то будет отображен пустой фрейм. В качестве URL допустимо использование не только HTML-, но и GIF-или JPEG-файла.

NAME="frame_name" -- описывает имя фрейма. Имя фрейма может быть использовано для определения действия с данным фреймом из другого HTML-документа или фрейма (как правило, из соседнего фрейма этого же документа). Имя обязательно должно начинаться с символа. Содержимое поименованных фреймов может быть задействовано из других документов при помощи специального атрибута TARGET, описываемого ниже.

MARGINWIDTH="n1" или MARGINHEIGHT="n2" -- используются, если автор документа хочет указать величину вертикальных или горизонтальных разделительных полос между фреймами сбоку. Значения n1 и n2 указываются в пикселах и не могут быть меньше единицы.

SCROLLING="yes | no | auto" -- позволяет задавать наличие полос прокрутки у фрейма. Параметр yes указывает на обязательное присутствие у фрейма полос прокрутки, параметр no -- на отсутствие, auto -- определяет наличие полос прокрутки только при их необходимости (значение по умолчанию).

NORESIZE -- отменяет возможность изменить при помощи мыши размер фрейма так же, как и размер окна Windows. Если у одного фрейма установлен атрибут NORESIZE, то у соседних фреймов тоже не может быть изменен размер со стороны данного.

BORDER -- управляет толщиной рамки.

BORDERCOLOR -- задает цвет рамки.

FRAMEBORDER=no -- отключает отображение рамки.

NOFRAMES используется в случае, если создается документ, который может просматриваться браузерами, как поддерживающими, так и не поддерживающими фреймы. Данный тэг помещается внутри контейнера FRAMESET, а все, что находится внутри тэгов <NOFRAMES> и </NOFRAMES> игнорируется браузерами, поддерживающими фреймы.

Пример: Рассмотрим реализацию фреймов для подобного разбиения окна: <FRAMESET ROWS="*,*">

<NOFRAMES>

<H1>Пример использования фреймов!</H1>

</NOFRAMES>

<FRAMESET COLS="65%,35%"> <FRAME SRC="link1.html">

<FRAME SRC="link2.html">

</FRAMESET>

<FRAMESET COLS="*,40%,*">

<FRAME SRC="link3.html">

<FRAME SRC="link4.html">

<FRAME SRC="link5.html"> </FRAMESET> </FRAMESET>

В браузере это будет выглядеть следующим образом:

Рисунок 10 - Фреймы

С появлением фреймов сразу возникает вопрос: "А как сделать так, чтобы, нажимая на ссылку в одном фрейме инициировать появление информации в другом?"

Ответом на данный вопрос является планирование взаимодействия фреймов. Каждый фрейм может иметь собственное имя, определяемое параметром NAME при описании данного фрейма. Существует, также, специальный атрибут -- TARGET, позволяющий определять, к какому фрейму относится та или иная операция. Формат данного атрибута следующий:

TARGET="windows_name"

Данный атрибут может встречаться внутри различных тэгов:

TARGET в тэге A. Это самое прямое использование TARGET. Обычно, при активизации пользователем ссылки соответствующий документ появляется в том же окне (или фрейме), что и исходный, в котором была ссылка. Добавление атрибута TARGET позволяет произвести вывод документа в другой фрейм.

Пример:

<A HREF="mydoc.html" TARGET="Frame1"> фрейм №1 </A>

TARGET в тэге BASE. Размещение TARGET в тэге BASE позволит не указывать при описании каждой ссылки фрейм-приемник документов, вызываемых по ссылкам. Это очень удобно, если в одном фрейме находится меню, а в другой выводится информация.

Пример:

Документ №1.

<FRAMESET ROWS="20,*">

<FRAME SRC="doc2.html" NAME="Frame1"> <FRAME SRC="doc3.html" NAME="Frame2"> </FRAMESET>

Документ №2 (doc2.html).

<HTML>

<HEAD>

<BASE TARGET="Frame2">

</HEAD>

<BODY>

<A HREF="url1"> Первая часть</A> |

<A HREF="url2"> Вторая часть</A>

</BODY> </HTML>

Также можно включать тэг TARGET в описание ссылки при создании карты изображения.

Пример:

<AREA SHAPE="circle" COORDS="100, 100, 50" HREF=" " TARGET="Frame1">

TARGET в тэге FORM. То же относится и к определению формы. В данном случае, после обработки переданных параметров формы результирующий документ появится в указанном фрейме.

<FORM ACTION="url" TARGET="window_name">

Зарезервированные имена фреймов служат для разрешения специальных ситуаций. Все они начинаются со знака подчеркивания. Любые другие имена фреймов, начинающиеся с подчеркивания, будут игнорироваться браузером.

TARGET="_blank". Данное значение определяет, что документ, полученный по ссылке, будет отображаться в новом окне браузера.

TARGET="_self". Данное значение определяет, что документ, полученный по ссылке, будет отображаться в том же фрейме, в котором находится ссылка. Это имя удобно для переопределения окна назначения, указанного ранее в тэге BASE.

TARGET="_parent". Данное значение определяет, что документ, полученный по ссылке, будет отображаться в родительском окне, вне зависимости от параметров FRAMESET. Если родительского окна нет, то данное имя аналогично "_self".

TARGET="_top". Данное значение определяет, что документ, полученный по ссылке будет отображаться на всей поверхности окна, вне зависимости от наличия фреймов. Использование данного параметра удобно в случае вложенных фреймов.

Microsoft Internet Explorer поддерживает и так называемые плавающие фреймы. Они могут появляться в любом месте экрана. Текст, расположенный на главной странице, обтекает этот фрейм.

Пример:

<IFRAME ALIGN=RIGHT WIDTH=50% HEIGHT=300 SRC="FILE.HTMl"> </IFRAME>

Реализация работы этого фрагмента программы в браузере представлена на рисунке 11.

Рисунок 11 - Плавающий фрейм

3.3.3 FTP

Один из протоколов TCP/IP, используемый для копирования файлов с одного компьютера на другой через Интернет. При этом оба компьютера должны поддерживать соответствующие роли FTP: один должен быть клиентом FTP, а другой -- сервером FTP.

FTP позволяет передавать файлы с компьютера на компьютер с помощью программ, поддерживающих протокол FTP (File Transfer Protocol). Данная команда может использоваться как в интерактивном, так и в пакетном режимах. В последнем случае она позволяет обрабатывать текстовые файлы в формате ASCII.

Синтаксис команды для подключения к FTP серверу:

Где

"сервер" обязателен, префикс "ftp://" также обязателен при подключении из командной строки и может быть пропущен при подключении из панели серверов. Все прочие части имени опциональны. Если имя пользователя не указано, то будет использовано "anonymous". Если пропущен пароль, то на сервер будет послан пароль по умолчанию, заданный в конфигурации FTP-клиента.

FTP-клиент позволяет работать с файлами FTP-сервера аналогично файлам на локальных дисках. Он поддерживает копирование, перенос и удаление файлов и папок, создание папок, просмотр и редактирование файлов. Кроме того, можно возобновить оборванную пересылку файла, воспользовавшись кнопкой "Возобновить" при запросе перезаписи файла, но эта функция должна поддерживаться и FTP-сервером. Также можно использовать команду "Поиск файла" для поиска требуемых файлов на FTP-сервере.

3.4 Контрольные вопросы

Понятие метаданных.

Варианты использования метаданных.

Понятие фрейма.

Синтаксис описания

Как указать фрейм в качестве области отображение для ссылки на какой либо ресурс. Возможные значения параметра «TARGET».

Как изменить толщину и цвет, рамки фрейма.

3.5 Тесты

1) Какие из перечисленных контейнеров размещают в заголовке документа?

а) <LINK HREF=”…” REL=”…”>;

б) <BODY BGCOLOR=”…” TEXT=”…”>;

в) <SCRIPT LANGUAGE=”…” SRC=”…”>;

г) <IMG SRC=”…” ALT=”…”>;

д) <META NAME=”...” CONTENT=”…”>.

2) Есть ли у параметра HEAD дополнительные атрибуты?

а) атрибутов нет;

б) есть атрибут PROFILE;

в) в DTD атрибуты не определены.

3) С помощью какого контейнера задается фреймовая структура документа?

а) FRAME;

б) BODY;

в) FRAMESET;

г) IFRAME.

4) Какие атрибуты надо указать тэгу <A> чтобы при нажатии на ссылку в одном фрейме, документ загружался в другом фрейме?

а) надо указать в атрибуте TARGET имя требуемого фрейма;

б) никаких дополнительных атрибутов не требуется;

в) необходимо указать TARGET=top_.

5) Как указывается страница для отображения в кадре?

а) с помощью атрибута HREF тэга FRAMESET;

б) с помощью атрибута LOCATION тэга BODY;

в) с помощью атрибута SRC тэга FRAME.

4. Лабораторная работа №4

Мультимедиа и графика. Создание табличных данных. Списки

4.1 Цель работы

Научиться применять мультимедиа, графику, таблицы и списки в HTML-документах, для улучшения их внешнего вида.

4.2 Порядок выполнения работы

Открыть созданный ранее Web-документ. Подобрать подходящие мультимедиа-файлы.

В данной работе необходимо в Web-документ вставить несколько подходящих по смыслу музыкальных фрагментов в разных форматах (.Wav, .Mid), озвучить фон странички каким-либо файлом в формате Mid. Подключить один AVI-файл, например файл, находящийся в папке с Delphi: “C:\Program Files\Borland\Delphi6\Demos\CoolStuf\cool.avi”. Данный файл подходит для наших целей, так как его размер не превышает 35 килобайт.

Вставить графические образы в Web - документ. Вначале оформить фон документа таким образом, чтобы графический файл был уложен на фоновой плоскости черепицей и оставался не подвижным при прокручивании документа.

Добавить в документ несколько графических файлов в качестве иллюстраций для улучшения внешнего вида. Необходимо помнить, что слишком большие графические файлы будут долго открывать на компьютере пользователя.

Создать несколько ссылок на внутренние или внешние ресурсы с использованием графических файлов.

Добавить на Web-страницу таблицу, содержащую элементы меню в виде списков, а в качестве элементов списков должны использоваться гиперссылки.

Изменить внешний вид таблицы и списков. Изменить рамку таблицы, её цвет толщину видимость и т.д., провести исследование всех основных атрибутов таблицы.

Создать таблицу вида:

Изображение

К сдаче лабораторной предоставляются: работающая страница на сервере с комментариями каждого тэга и его свойств (атрибутов) в исходнике.

4.3 Методические указания

4.3.1 Мультимедиа

Начнём со вставки звука и видео на страницу. Синтаксис тэга:

<EMBED src="File" width="n1" height="n2" controls="smallconsole" autostart="false" loop="true" play_loop="2" hidden="true"></EMBDED>

Где

SRC="File" - MIDI (*.mid), WAV (*.wav) или AVI (*.avi - видео) файл.

WIDTH="n1" HEIGHT="n2" - ширину (width) и высоту (heigth) пульта управления.

CONTROLS="smallconsole" - при использовании этого атрибута пульт становится маленьким.

AUTOSTART="false" - надо ли проигрывать снова видео или музыкальный ролик (false - нет, true - да).

LOOP="true" - повторять ролик с самого начала (false - нет, true - да).

PLAY_LOOP="3" - если да, то сколько раз (вместо 3 поставить кол-во раз).

HIDDEN="true" - спрятать пульт ролика (false - нет, true - да).

Но можно, и даже лучше ставить просто ссылку на видео файл, так как браузер сам запускает плагины для их воспроизведения, и отпадает необходимость во вставке выше перечисленного HTML кода.

Пример:

<A HREF="VideoFail.avi">Мой видео файл</A>

А если файл находится не на разрабатываемой странице, то нужно прописать весь адрес файла.

Пример:

<A HREF=" /VideoFail.avi">Мой видео файл</A>

RealAudio и RealVideo - это такая программа, которая может воспроизводить музыку в online или файлы с музыкой или видео в Real формате.

Вначале необходимо открыть программу RealEncoder (до этого надо её установить), заполнить там строки Title (Название), Author (Автор), Copyright (Права на это принадлежат...). Потом выбрать справа качество записи (лучше брать Audio 28.800 Voice для аудио файла и Video 28.800 High Action для видео файла, но можно и другие). Затем открыть в меню File => Open session. Там нужно выбрать File и нажать кнопку Add и выбрать свой аудио или видео файл. Затем нажать кнопку "Save as..." и сохранить его под любым именем. Выполнив всё это, нажать "OK", внизу загораются кнопка Start -необходимо нажать её. Вот и сделали Real файл. Теперь осталось разместить его на своей странице, сделав просто ссылку на файл.

Также можно сделать так, чтобы музыку слушали люди в ONLINE режиме. Нужно взять любой текстовый редактор (Блокнот для Windows, к примеру) и написать адрес Real файла в Интернете, но заменив http на pnm. И получится что-то похожее на это:

И сохранить в формате *.ram. Ну и надо теперь просто дать ссылку на ram файл, и он будет брать файл с музыкой или видео и показывать его через RealPlayer.

Простейший способ озвучить фон странички - добавить в тело создаваемого документа тэг вида:

Пример:

<BGSOUND LOOP="1" SRC="file.mid"></BGSOUND>

Тэг имеет всего два атрибута: LOOP задает число повторений проигрывания пьесы, (LOOP=0 позволяет мелодии звучать постоянно).SRC -файл-источник.

Подобные элементы при хорошем подборе музыкального файла могут создавать оригинальную атмосферу сайта.

4.3.2 Графика и анимация

Одним из способов использования графики в HTML является внедрение графических образов в документ, что позволяет пользователю непосредственно увидеть изображения. Такая техника проектирования документов называется “online image".

Синтаксис тэга:

<IMG SRC="URL" ALT="text" HEIGHT=n1 WIDTH=n2 ALIGN=top|middle|bottom|texttop|absmiddle|baseline|absbottom|left|right BORDER=n VSPACE=m1 HSPACE=m2 ISMAP>

Где

URL -- адрес, указывающий браузеру, где находится рисунок. Рисунок должен храниться в графическом формате, поддерживаемом браузером.

ALT="text" задает текст, который будет отображен браузером, не поддерживающим отображение графики или с отключенной подкачкой изображений.

HEIGTH=n1 используется для указания высоты рисунка в пикселях. Если данный параметр не указан, то используется оригинальная высота рисунка. Это параметр позволяет сжимать или растягивать изображения по вертикали, что позволяет более четко определять внешний вид документа.

WIDTH=n2 позволяет задать абсолютную ширину рисунка в пикселях.

ALIGN используется, чтобы сообщить браузеру, куда поместить следующий блок текста. Это позволяет более строго задать расположение элементов на экране. Если данный параметр не используется, то большинство браузеров располагает изображение в левой части экрана, а текст справа от него.

BORDER=n позволяет автору определить ширину рамки вокруг рисунка (n=0..9).

VSPACE=m1 позволяет установить размер в пикселях пустого пространства над и под рисунком, чтобы текст не наезжал на рисунок. Особенно это важно для динамически формируемых изображений, когда нельзя заранее увидеть документ.

HSPACE=m2 выполняет то же самое, что и VSPACE, но только по горизонтали.

ISMAP сообщает браузеру, что данное изображение позволяет пользователю выполнять какие-либо действия, щелкая мышью на определенном месте изображения. Данная возможность является расширением HTML и в круг вопросов, освещаемых в данной пособии, не входит.


Подобные документы

  • Особенности программирования на языке HTML и JavaScript. Основные стили форматирования текста. Анализ основных приемов и методов создания страниц, рисунков, таблиц и гиперссылок. Основные цвета и их коды. Разработка собственного сайта и его презентация.

    курсовая работа [61,3 K], добавлен 29.01.2016

  • Ввод и редактирование формул. Создание абсолютной или смешанной ссылки. Режимы пересчета формул. Присвоение, изменение и удаление имен ячеек. Ссылки на листы и книги. Создание имен из заголовков строк или столбцов. Присвоение имен константам и формулам.

    курсовая работа [2,9 M], добавлен 02.01.2012

  • Автоматический ввод значений. Приемы копирования информации. Работа с формулами и функциями. Построение диаграмм, редактирование ячеек, форматирование листа. Вставка строк и столбцов. Добавление кнопок на панель инструментов. Поиск данных в списках.

    курсовая работа [40,7 K], добавлен 27.04.2013

  • Знакомство с программой PageMaker: создание новой публикации; форматирование символов и абзацев; глобальное форматирование. Импорт и редактирование текста. Рисование средствами PageMaker. Импорт графики. Связывание файлов. Компоновка текста и графики.

    лабораторная работа [2,2 M], добавлен 01.12.2007

  • Работа в окне документа. Ввод текста. Вставка и удаление текста. Отмена результатов выполненных действий. Перемещение и копирование текста методом "перетащить-оставить". Форматирование текста. Сохранение документа. Шаг вперед: смена регистра.

    лабораторная работа [220,9 K], добавлен 10.03.2007

  • Интерфейс текстового редактора MS Word. Редактирование и форматирование текста в MS Word, вставка таблиц, текста WordArt и объектов из другого приложения. Создание схематических диаграмм, использование данных из табличного процессора Microsoft Excel.

    презентация [1022,7 K], добавлен 05.06.2015

  • Ввод, редактирование и форматирование данных в табличном редакторе Microsoft Excel, форматирование содержимого ячеек. Вычисления в таблицах Excel при помощи формул, абсолютные и относительные ссылки. Использование стандартных функций при создании формул.

    контрольная работа [430,0 K], добавлен 05.07.2010

  • Выбор гарнитуры шрифта, размера, стиля начертания шрифта. Выделение содержимого текста. Повтор набранного. Перенос и копирование содержимого. Выравнивание абзацев. Установка красной строки. Абзацные отступы и интервалы.

    лабораторная работа [209,4 K], добавлен 10.03.2007

  • Описания программных средств, предназначенных для создания, редактирования и форматирования простых и комплексных текстовых документов. Настройка параметров абзаца, ввод символов, средства создания списков. Копирование и перемещение участков текста.

    реферат [194,3 K], добавлен 26.03.2015

  • Функциональные возможности табличного процессора Excel. Запуск и завершение работы, окно программы, структура электронной таблицы, типы данных. Ввод и редактирование данных, редактирование и форматирование диаграмм. Защита информации в таблицах Excel.

    курсовая работа [3,1 M], добавлен 09.11.2009

Работы в архивах красиво оформлены согласно требованиям ВУЗов и содержат рисунки, диаграммы, формулы и т.д.
PPT, PPTX и PDF-файлы представлены только в архивах.
Рекомендуем скачать работу.