Logo GenDocs.ru

Поиск по сайту:  


Загрузка...

Создание HTML-страниц - файл 1.doc


Создание HTML-страниц
скачать (3412.5 kb.)

Доступные файлы (1):

1.doc3413kb.05.02.2012 10:43скачать

содержание
Загрузка...

1.doc

Реклама MarketGid:
Загрузка...




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


по курсу «WEB – ПРОГРАММИРОВАНИЕ»


Выполнила: студентка 5 курса

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

шифр 602654

Токаревой О.П.

Проверил:
Москва

2009
Описание проекта

Всемирная паутина World Wide Web (WWW) соткана из Web-страниц, которые создаются с помощью, так называемого языка разметки гипертекста HTML (Hyper Text Markup Language). Хотя многие говорят о программировании на этом языке, HTML вовсе не является языком программирования в традиционном понимании. HTMLязык разметки документа. При разработке HTML -документа выполняется разметка текстового документа точно так же, как это делал бы человек при помощи красного карандаша. Эти пометки служат для указывания формы представления информации, содержащийся в документе.

^ HTML -документы можно писать в обычном «Блокноте» и сохранять с расширением .htm или .html. Более мощные редакторы типа «Word» для этого не подходят!

Проект состоит из двух HTML-страниц, которые содержат информацию о морских животных – Дельфинах, и имеют ссылки друг на друга.

На первой странице (Text.html) размещён гипертекст, а также две ссылки, в начале и в конце документа, в виде текстовой надписи и иконки, на вторую страницу проекта (Images.html) с фотографиями.

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

▫ <TITLE>…</TITLE> – тег заголовка, дающий название всему документу;

▫ Параметры тега <BODY>…</BODY>:

BGCOLOR="F0F8FF" – определяет цвет фона документа;

VLINK="teal" – определяет цвет не просмотренной ссылки;

ALINK="EE82EE" – определяет цвет просмотренной ссылки;

▫ Атрибут тега <font>…</font> – шрифт:

color="#4B0082" – определяет цвет текста документа;

▫ <H2 align="center">…</H2> – тег заглавия статьи с выравниванием по центру, где 2 – размер шрифта;

▫ <em>…</em> – (EMphasis) тег выделения важных фрагментов текста;

▫ <br> – тег перевода на новую строку без создания абзаца;

▫ <HR> – (Horizontal Rule) тег вставки горизонтальной разделительной линии с атрибутами:

width="80%" – определяет длину линии в процентах от ширины окна;

size="2" – определяет толщину линии в пикселях;

align="center" – определяет выравнивание линии по центру;

color="#0000FF" – определяет цвет линии;

▫ <p>…</p> – тег создания нового абзаца с атрибутом:

align="justify" – определяет выравнивание текста по ширине окна;

▫ <i>…</i> – тег выделения текста курсивом;

▫ <b>…</b> – тег выделения текста полужирным шрифтом;

▫ <A>…</A> – тег вставки указателя ссылки с параметрами:

href="Images.html" – определяет URL-адрес файла, на который указывает ссылка;

title="ФОТО" – определяет текст подсказки, которая будет появляться при наведении курсора на гиперссылку;

▫ <IMG> – тег вставки изображения в ^ HTML-документ с параметром:

src="icon.jpg" – определяет имя и URL-адрес файла с графическим изображением;

Листинг (Text.html)

<HTML>
<HEAD>

<TITLE>Дельфины</TITLE>

</HEAD>
<BODY BGCOLOR="F0F8FF" VLINK="teal" ALINK="EE82EE">
<font color="#FF00FF">

<H2 align="center">Дельфины</H2>

</font>
<em>

Всей кожей, ощущая соль ветров, <br>

Дельфины перепрыгивали волны. <br>

И спинами касаясь облаков, <br>

Играли с солнечной пыльцой привольно...

</em>
<HR width="80%" size="2" align="center" color="#0000FF">
<A href="Images.html" title="ФОТО"><IMG src="Image/icon.jpg"></A><br>

<A href="Images.html">Посмотреть Фотографии</A>
<font color="#4B0082">
<p align="justify"> Встречи с дельфинами оставляют у каждого из нас незабываемые впечатления. Блестя упругими телами, похожими на торпеды, дельфины выпрыгивают из воды и могут подолгу сопровождать прогулочные катера и яхты. Вдруг в разных местах, будто сообразно неслышному сигналу, они парами, тройками и целыми группами выпрыгивают на метр-два из воды, описывают плавную дугу, и врезаются в воду, чтобы чрез секунду вновь взметнуться вверх.
<p align="justify"> Их блестящие тела поражают идеально обтекаемой формой. Морда вытянута в тесный рот, ноздри слиты в одно "дыхало", из которого животное может извергать фонтан брызг высотой 1-1,5 м.
<p align="justify"> Самые распространённые дельфины <i>Афалины</i> в размере достигают 2,5-3 м., а их вес может превысить 200 кг. Удивительно, как при таких габаритах дельфин развивает большую скорость. Самые быстрые из них развивают скорость более 50 км/час и способны обогнать корабль, а в минуту особой опасности даже больше. Живут <i>афалины</i> до 25 лет, держаться небольшими группами, питаются рыбой и беспозвоночными. За пищей этот дельфин может нырять на глубину до 150 м., находясь под водой 15 минут. После брачного спаривания, а оно наступает в теплое время года, у самки дельфина обычно рождается один детеныш. Сегодня специалисты насчитывают в Черном море примерно 36 тысяч особей дельфинов.
<p align="justify"> Дельфины - это самые мелкие китообразные. Они сродни и громадным <i>синим китам</i>, и зубастым <i>кашалотам</i>. Наиболее близкие родичи дельфинов - из того же семейства <i>белухи</i>, распространенные на севере России, а также в Охотском и Японских морях. Длиной они бывают до 6 метров, а весом - около тонны. Эти животные держатся стаями до 1000 единиц. Новорожденные <i>белухи</i> темно-синие и только после трех лет становятся чисто белыми. На севере их раньше промышляли в больших количествах.
<p align="justify"> Дельфины питаются крупной и мелкой рыбой, моллюсками, в том числе и головоногими. Родичей дельфинов - больших <i>касаток</i>, достигающих 5-10 метров в длину и веса 8 тонн, люди называют <b>"китами-убийцами"</b>. Собираясь в стаи численностью до 200 особей, эти хищники могут напасть даже на гиганта-кита, вырывая острыми зубами куски его мяса. Люди бесконечно боялись и ненавидели касаток. В последствие оказалось, что эти "свирепые" звери прекрасно привыкают к человеку, и в океанариумах показывают трюки не хуже, чем ручные дельфины. Просто у них такой образ охоты, похожий, как у волков либо у диких собак. Ведь китообразные - тоже звери, а не рыбы. Первый признак этого – хвост, расположенный горизонтально. Но самое главное и неоспоримо - они дышат воздухом и выкармливают детенышей молоком. Ученые, считают, что предки морских млекопитающих раньше жили на суше.
<p align="justify"> Дельфины — высокоразвитые морские обитатели с высочайшим для животных интеллектом, прекрасно поддаются дрессировке и охотно вступают в контакт с человеком. Количество извилин головного мозга дельфина даже больше, чем у человека. Для дельфинов характерны любознательность, игривость и доброжелательность.
<p align="justify"> Образ дельфинов вошел в легенды и сказания многих народов мира. Были известны случаи, когда дельфины помогали спасать тонущих в море людей. Дельфины помогают рыбакам загонять рыбу в сети. А дельфин по кличке <i>Пелорус Джек</i>, прозванный так английскими моряками, в течение 30 лет проводил суда чрез опасный пролив в Новой Зеландии, как заправский штурман. В его защиту был издан особенный закон.

<br> Был случай, когда одно пассажирское судно потерпело крушение, и оставшиеся в живых люди с ужасом увидели, что их окружает вереница акул. Но вдруг из открытого моря примчалась стая дельфинов. Они разогнали акул и даже помогли выбраться из воды ослабевшим людям, пока не подоспела помощь. Ведь и сами они дышат воздухом и часто помогают раненому собрату вынырнуть из глубины. Может быть, дельфины просто принимают людей за "собратьев"?

</font>
<HR width="50%" size="2" align="left" color="#000000">

<font color="#000000">

ЧЁРНЫЙ ЮМОР <br>

<em> А вы знаете, почему все люди, спасённые дельфинами, как один рассказывают, что дельфины толкали их к берегу? <br>

Потому что все те, кого дельфины толкали от берега, утонули!

</em>

</font>

<HR width="50%" size="2" align="left" color="#000000">
<font color="#4B0082">

<p align="justify"> Ученые установили, что дельфины при помощи писка издают множество различных звуков. Через специальные приборы эти сигналы удалось не только услышать, но и записать на пленку. Запас "слов" у дельфинов достаточно велик. Они могут передавать друг другу сложную информацию. Их учат помогать специалистам при подводных водолазных работах: подавать инструменты, доставлять письма и "посылки". Это уже не фокусы, а настоящее помощь.

<br> Совсем маленьких, новорожденных детишек обучают плавать в одном бассейне с дельфинами, и те бережно поддерживают малышей в воде, будто собственных дельфинят. Такая дружба с сильными, добрыми животными оказывается весьма благотворной как для детей, так и для взрослых.

<br> Поняв разумность дельфинов, люди стали больше их изучать, стараясь найти с ними "общий разговор". И возможно, мы ещё узнаем немало интересного об этих грациозных животных, которые водятся во всех морях мира. </p>

</font>
<HR width="80%" size="2" align="center" color="#0000FF">
<A href="Images.html" title="ФОТО"><IMG src="Image/icon.jpg"></A><br>

<A href="Images.html">Посмотреть Фотографии</A>
</BODY>

</HTML>






На второй странице (Images.html) находится галерея фотографий Дельфинов, размещённых в ячейках таблицы, а также две ссылки, в начале и в конце документа, на первую страницу проекта с гипертекстом (Text.html) в виде текстовых надписей, также помещённых в ячейках таблицы. В качестве фонового изображения использован графический файл Water.jpg.

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

▫ <TITLE>…</TITLE> – тег заголовка, дающий название всему документу;

▫ Параметры тега <BODY>…</BODY>:

background="Image/Water.jpg" – определяет фоновое изображение документа;

VLINK="teal" – определяет цвет не просмотренной ссылки;

ALINK="EE82EE" – определяет цвет просмотренной ссылки;

▫ <H2 align="center">…</H2> – тег заглавия статьи с выравниванием по центру, где 2 – размер шрифта;

▫ <HR> – (Horizontal Rule) тег вставки горизонтальной разделительной линии с атрибутами:

width="80%" – определяет длину линии в процентах от ширины окна;

size="2" – определяет толщину линии в пикселях;

align="center" – определяет выравнивание линии по центру;

color="#0000FF" – определяет цвет линии;

▫ <TABLE>…</table> – тег создания таблицы с атрибутом:

align="center" – определяет расположение таблицы по центру документа;

▫ <tr>…</tr> – (Table Row) тег, определяющий строку таблицы;

▫ <td>…</td> – (Table Data) тег, определяющий ячейку в строке таблицы с атрибутом;

align="center" – определяет выравнивание текста по центру ячейки;

▫ Атрибут тега <Font>…</Font> – шрифт:

size="6" – определяет размер шрифта;

▫ <IMG> – тег вставки изображения в ^ HTML-документ с параметром:

src="Image/img1.jpg" – определяет имя и URL-адрес файла с графическим изображением;

▫ <A>…</A> – тег вставки указателя ссылки с параметром:

href="Text.html" – определяет ^ URL-адрес файла, на который указывает ссылка;

Листинг (Images.html)

<HTML>
<HEAD>

<TITLE>Фотографии дельфинов</TITLE>

</HEAD>
<BODY background="Image/Water.jpg" VLINK="#3333FF" ALINK="#800080">

<H2 align="center">Фотогаллерея</H2>
<HR width="80%" size="2" align="center" color="#0000FF">
<TABLE align="center">

<tr>

<td align="center"><Font size="6"><A href="Text.html">Описание</A> </Font></td>

<td><img src="Image/img2.jpg"></td>

<td><img src="Image/img3.jpg"></td>

</tr>

<tr>

<td><img src="Image/img4.jpg"></td>

<td><img src="Image/img5.jpg"></td>

<td><img src="Image/img6.jpg"></td>

</tr>

<tr>

<td><img src="Image/img7.jpg"></td>

<td><img src="Image/img8.jpg"></td>

<td><img src="Image/img9.jpg"></td>

</tr>

<tr>

<td><img src="Image/img1.jpg"></td>

<td><img src="Image/img10.jpg"></td>

<td align="center"><Font size="6"><A href="Text.html">Описание</A>

</Font></td>

</tr>

</table>
<HR width="80%" size="2" align="center" color="#0000FF">
</BODY>

</HTML>



ЛИТЕРАТУРА
1. Учебник html. – http://v-vb.com/index.php

2. Учебник по JavaScript. – http://www.html-consult.net/

3. Учебник html . - http://on-line-teaching.com/html/lsn012.html






Скачать файл (3412.5 kb.)

Поиск по сайту:  

© gendocs.ru
При копировании укажите ссылку.
обратиться к администрации
Рейтинг@Mail.ru