рефераты конспекты курсовые дипломные лекции шпоры

Реферат Курсовая Конспект

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

Структура HTML – документа - раздел Программирование, Общие принципы проектирования HTML-документа <!doctype Html Public “-//w3C//dtd Html 4.0//en”> <html>...

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0//EN”>

<HTML>

<HEAD>

<TITLE>Заголовок документа</TITLE>

</HEAD>

 

<BODY>

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

</BODY>

</HTML>

Документ HTML может быть создан в любом текстовом редакторе, допускающем подготовку файлов с расширением-*.htm (*.html), или в специализированных HTML-редакторах и конвертерах. Для начального изучения вопросов проектирования Web-страниц, а именно для этого предназначается данные методические указания, целесообразно использовать текстовый редактор Блокнот (Notepad), имеющий минимальные средства редактирования текста. Это позволит наилучшим образом усвоить основные принципы и особенности проектирования Web-страницы.

Пример 1.1. Сформируем текст HTML-документа в текстовом редакторе Блокнот и сохраним его в файле index_1.html в папке Проект_Web.

Замечание. Файл сохраняется с расширением — *.html

 

<HTML>

<HEAD>

<TITLE>Проектирование Web-страницы </TITLE>

</HEAD>

 

<BODY>

Это моя первая Web-страница

</BODY>

</HTML>

 

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

Заголовок документа выделяется операторами <HEAD> и </HEAD>. Элемент <HEAD> (заголовок) определяет информацию о документе в целом. Заголовок документа должен содержать название документа, ограничиваемое операторами <TITLE> и </TITLE>. Тело документа, ограничиваемое операторами <BODY> и </BODY>, содержит всю информацию страницы. В данном случае эта информация ограничивается сообщением — “Это моя первая Web-страница”.

Просмотр документа. Откройте папку, в которой сохранен файл index_1.html, и запустите его на исполнение, сделав двойной щелчок левой клавишей мыши на пиктограмме файла. Активизация файла index_1.html автоматически вызывает установленную на вашем компьютере программу просмотра (программу – броузер (browser)) Microsoft Internet Explorer (IE) или Netscape Navigator (NN), в окне которого появляется содержимое вашего документа.

Второй способ (для определенности в дальнейшем будем использовать броузер Microsoft Internet Explorer, русифицированная версия 5.0) просмотра HTML – документа, записанного в файле, заключается в том, что вначале запускается броузер, а затем открывается нужный файл (в рассматриваемом примере –index_1.htm). Для открытия файла из меню Файлвыбираем командуОткрыть,а затем в появившейся диалоговой панелиОткрытьуказываем адрес HTML-документа и запускаем файл на исполнение. Результат выполнения — Web-страница, соответствующая примеру (рис.1.1).

Рис.1.1. Просмотр Web-страницы, соответствующей примеру 1.1.

В раскрывшемся окне броузера мы видим содержание нашей Web-страницы – Это моя первая Web-страница.В заголовке окна броузера мы видим заголовок страницы – ”Проектирование Web – сайта”.

Рассмотрим приведенный пример подробнее.

Заголовок документа. Элемент <HEAD>. Заголовок документа выделяется операторами <HEAD> и </HEAD>. Элемент <HEAD> (заголовок) определяет информацию о документе в целом. Заголовок документа может содержать:

- название документа <TITLE>. Любой документ может иметь не более одного названия. Название не является частью текста и должно характеризовать содержание документа;

- гипертекстовые ссылки <LINK>. Используются для указания взаимоотношения между данным документом и каким-либо другим объектом, адресуемым URI. Документ может иметь любое количество элементов LINK;

- базовый адрес <BASE>. Элемент BASE позволяет документу самому назначать URI для использования сокращенных записей в теле документа;

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

Рассмотрим только оператор <TITLE>. Другие операторы будут рассмотрены далее. В заголовке с помощью операторов <TITLE> и </TITLE> задается идентификатор документа (Проектирование Web-сайта), который отображается в заголовке главного окна навигатора. Пара операторов <TITLE> и </TITLE> в заголовке являются обязательными.

Тело документа. Элемент <BODY>. Тело документа, ограничиваемое операторами <BODY> и </BODY>, содержит всю информацию страницы. В данном случае эта информация ограничивается сообщением — “Это моя первая Web-страница”.

Открывающий и закрывающий операторы <BODY> и </BODY> соответственно могут быть одновременно опущены. В этом случае броузер сам будет определять начало и конец содержания, ограниченное операторами. Учитывая, что поиск “начала и конца содержания” не формален, результат может быть не однозначен. Поэтому операторы <BODY> и </BODY> лучше указывать.

Атрибуты элемента <BODY>:

Наименование атрибута Описание атрибута
bgcolor Задает цвет фона документа. Значение атрибута задается шестнадцатеричным числом или собственным именем. Например, bgcolor = #FFFF00; bgcolor = yellow.
background Указывает URI графического файла, используемого в качестве фона документа (не рекомендуемый[3]).
text Определяет цвет текста на странице (не рекомендуемый).
link Задает цвет ссылок (не рекомендуемый).
vlink Задает цвет просмотренных ссылок, на которых находится маркер в данный момент (не рекомендуемый).
alink Задает цвет активных ссылок (не рекомендуемый).
bgproperties bgproperties = fixed. В этом случае фон документа не прокручивается вместе с текстом, а остается “привязанным” к экрану.
topmargin leftmargin bottommargin rightmargin Задает в пикселях расстояние между окном и текстом соответственно сверху, слева, снизу и справа.  
scroll Устанавливает полосы прокрутки

Кроме отмеченных, присущих только этому элементу атрибутов, элементу <BODY> присущи и так называемые общие атрибуты. Общие атрибуты приведены в п. 1.2.

С элементом <BODY>, точно также как и с другими элементами HTML, связан еще один класс атрибутов — атрибуты для установки обработчиков событий: onclick, ondblclick, onmousedown, onmouseup и другие. Этот класс атрибутов будет рассматриваться далее.

В качестве содержания (контента) элемента <BODY> могут использоваться:

- блочные заголовки <H1>, . . . <H6>, элементы: <P>, <DIV>, <DL>, <PRE>, <BLOCKQUOTE>, <FIELDSET>, <ADDRESS>, <HR>, <TABLE>, списки <UL>, <OL>, скрипты <SCRIPT>, <NOSCRIPT>;

- встроенные элементы:

- текст;

- элементы физического форматирования — <B>, <BIG>, <I>, <S>, <STRIKE>, <SMALL>, <TT>;

- элементы логического форматирования — <EM>, <STRONG>, <DFN>, <CODE>, <SAMP>, <KBD>, <VAR>, <CITE>, <ABBR>, <ACRONIM>;

- специального назначения — <A>, <IMG>, <MAP>, <APPLET>, <OBJECT>, <SCRIPT>, <SPAN>, <IFRAME>, <FONT>, <BASEFONT>, <BR>, <SUB>, <SUP>, <BDO>, <Q>;

- форм — <INPUT>, <SELECT>, <TEXTAREA>, <BUTTON>, <LABEL>.

Элемент <BODY> не может содержать в качестве контента разделы <!doctype>, <html>, <head>.

Пример 1.2. Рассматриваемый пример иллюстрирует использование атрибута background. В качестве фона документа выбрано изображение, которое хранится в файле Bk_paper1.jpg.

Замечание. Отметим: хранение файлов index.html и Bk_paper1.jpg в одной папке позволяет не прописывать весь путь к файлу Bk_paper1.jpg, а указать только его имя. Если условие хранения файлов в одной папке не выполняется, то необходимо прописывать путь к файлу. Представим пример 1.2 в виде:

 

<HTML>

<HEAD>

<TITLE>Проектирование Web-страницы </TITLE>

</HEAD>

 

<BODY background=Bk_paper1.jpg>

Это моя первая Web-страница

</BODY>

</HTML>

Результат выполнения примера (рис. 1.2.)

Рис.1.2. Просмотр Web-страницы, соответствующей примеру 1.2.

В заключение отметим, что при проектировании Web-сайта используются различные технологии написания Web-страниц:

- язык гипертекстовой разметки HTML;

- каскадные таблицы стилей CSS;

- Web-редакторы.

– Конец работы –

Эта тема принадлежит разделу:

Общие принципы проектирования HTML-документа

Структура документов в формате HTML... В рекомендациях W первой строкой создаваемого документа указывается... lt DOCTYPE HTML PUBLIC W C DTD HTML EN gt...

Если Вам нужно дополнительный материал на эту тему, или Вы не нашли то, что искали, рекомендуем воспользоваться поиском по нашей базе работ: Структура HTML – документа

Что будем делать с полученным материалом:

Если этот материал оказался полезным ля Вас, Вы можете сохранить его на свою страничку в социальных сетях:

Все темы данного раздела:

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

Технология подготовки гипертекстового документа
Web-технология позволяет объединить в одном документе самые разные формы представления информации — текст, таблицы, графику, звук и многое другое, а также соединить в гипертекстовую систему

Проектирование HTML – документа
Гипертекст в формате HTML представляется совокупностью структурных блоков. Разметка гипертекста осуществляется элементами[2], поэтому содержание структурного блока и элементы разметки также называю

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

Описание термина располагается в контейнере <DD>описание</DD>.
  Пример 2.5. Списки-определения. <HTML> <HEAD> <TITLE>Проектирование WEB- сайта</TITLE> </HEAD>

Форматирование шрифта
  В языке разметки HTML определены операторы физического и логического форматирования символов. Операторы физического форматирования явным образом определяют внешний вид симв

Цвет в HTML – документах
Язык разметки гипертекста HTML позволяет указывать цвет фона документа, текста (заголовков и отдельных слов), полей ссылок на другие документы и так далее. Обозначение цвета.

Графика в HTML-документах
В HTML-документах возможно использование растровой и векторной графики. Программы просмотра отображают три формата растровой графики GIF (Graphics Interchange Format) – формат (быстрого) о

Сегментированная графика. Элементы <MAP> и <AREA>.
Сегментированная графика или графическая карта (imagemap) представляется обычным изображением с выделенными чувствительными (активными) областями. Активные области изображения являются ссылками на

Хотите получать на электронную почту самые свежие новости?
Education Insider Sample
Подпишитесь на Нашу рассылку
Наша политика приватности обеспечивает 100% безопасность и анонимность Ваших E-Mail
Реклама
Соответствующий теме материал
  • Похожее
  • Популярное
  • Облако тегов
  • Здесь
  • Временно
  • Пусто
Теги