Автор работы: Пользователь скрыл имя, 15 Марта 2012 в 11:19, реферат
World Wide Web — это не какое-то определенное место в Интернете, это не какой-то компьютер или нечто, с чем можно «установить сеанс связи». Всемирную паутину можно, скорее, назвать услугой, предоставляемой в рамках Интернета. Использование определенных протоколов, компьютеров, называемых веб-серверами (потому что они подключены к Сети и на них запущено серверное программное обеспечение) делает предоставление этой услуги возможным. То есть серверы могут отвечать на запросы клиента, на котором установлен веб-браузер.
Введение…………………………………………………………………………...3
1.Общие сведения о создании WEB – страниц………………………………….5
2. Создание и оформление WEB – страниц……………………………………..9
2.1.Форматирование текста……………………………………………………..13
2.2.Вставка иллюстраций………………………………………………………..18
Заключение……
<html>
<head>
<title>Лицей № 1548</title>
</head>
<body bgcolor=blue text=yellow>
Добро пожаловать на страничку лицея № 1548! Здесь Вы узнаете о нашей деятельности, о наших интересах и увлечениях, о наших успехах и достижениях
</body>
</html>
Теперь документ следует сохранить. Откройте ранее созданную папку Web, введите имя файла licey1548.html и нажмите кнопку Сохранить.
Обратите внимание: вы обязательно должны указать расширение имени файла .html или .htm, чтобы браузер смог его открыть.
Возможно, в вашем браузере размер шрифта текста будет крупнее или мельче, чем на рисунке. В таком случае выберите команду меню Вид • Размер текста • Средний в браузере Internet Explorer или Вид • Увеличить шрифт, Вид • Уменьшить шрифт в браузере Netscape Communicator, чтобы установить средний размер шрифта.
Следует иметь в виду, что разные браузеры могут по-разному отображать содержимое одного и того же HTML-файла. Поэтому при создании Web-страниц желательно всегда просматривать результат в обоих наиболее популярных браузерах - Internet Explorer и Netscape Communicator. В таком случае вы будете уверены, что посетитель вашего сайта увидит именно то, что вы хотите ему показать.
Так как в элементе <body></body> мы ввели текст без разбивки на абзацы, то в браузере он отображается в виде одного абзаца и выровнен влево. Теперь следует придать тексту более наглядный вид.
Чтобы наша Web-страница выглядела более привлекательно, разделим текст на абзацы и выделим заголовок. HTML имеет шесть уровней заголовков разделов документа, пронумерованных цифрами от 1 до 6. Заголовки объявляются парой тэгов с номерами, соответствующими уровню, например, <h1></h1> - заголовок раздела первого уровня, а <h6></h6> - заголовок раздела шестого уровня. От нормального текста заголовки отличаются размером и толщиной букв. Заголовок первого уровня h1 отображается обычно очень крупным шрифтом, в то время как заголовок шестого уровня h6 - очень мелким.
Не следует путать заголовки разделов документа с рассмотренным ранее заголовком документа, определяемым элементом <head></head>.
В качестве заголовка текста используем первое предложение - Добро пожаловать на страничку лицея 1548! Для этого достаточно ограничить его тэгами <h1> и </h1>.
Вставьте в текст файла licey1548.html тэги <h1> и </h1> так, чтобы они ограничивали первое предложение текста, и этот фрагмент кода принял следующий вид:
<h1>Добро пожаловать на страничку лицея 1548!</h1>
Сохраните файл, выбрав команду Сохранить меню Файл программы Блокнот.Операцию сохранения необходимо всегда выполнять перед просмотром документа, так как браузер открывает файл для просмотра, загружая его в оперативную память компьютера с диска. Если после редактирования кода HTML вы не сохраните файл, то никаких изменений в браузере не увидите.
Нажмите клавишу F5 или кнопку Обновить на панели инструментов рабочего окна программы Internet Explorer или аналогичную кнопку Обновить в Netscape Communicator. Файл licey1548.html будет перезагружен, и вы увидите в окне браузера, как выглядит заголовок первого уровня.
Используя шесть уровней заголовков, которые предоставляет в ваше распоряжение язык HTML, можно создать легко читаемый документ с интуитивно ясной структурой. Помните, что ваш документ всегда будет читаться значительно лучше, если в нем будет четкое разделение на разделы и подразделы.
По умолчанию заголовок выравнивается по левому краю страницы. Но его можно также выровнять по правому краю или центрировать. Для правостороннего выравнивания в тэге <h1> используется атрибут align=right, а для центрирования — align=center. Допускается также явное указание левостороннего выравнивания - align=left.
Добавьте в тэг <h1> атрибут align=center, чтобы центрировать заголовок. Этот элемент должен принять следующий вид:
<h1 align=center>Добро пожаловать на страничку лицея 1548!</h1>
Теперь займемся остальным текстом. Увеличим его размер и оформим текст полужирным курсивным начертанием. Для установки полужирного начертания используются парные тэги <b></b>.
Вставьте в файле licey1548.
Курсивное начертание устанавливается с помощью тэгов <i></i>.
Вставьте в исходный код HTML тэг <i> и </i> так, чтобы отредактированный элемент принял следующий вид:
<b><i>Здесь Вы узнаете о нашей деятельности, о наших интересах и увлечениях, о наших успехах и достижениях</i></b>
Элементы разметки могут быть вложенными, как в данной структуре, где элемент <i>...</i> вложен в элемент <b>...</b>. Современные браузеры способны правильно обрабатывать вложенные тэги. Поэтому вам необходимо следить за тем, чтобы не нарушался порядок вложения. Работа браузера окажется затрудненной, если вложенность будет нарушена. Например, такая запись будет неправильной: <b><i>...</b></i>. Соблюдение вложенности - очень важная часть общей культуры написания HTML-кода.
С помощью пары тэгов <u></u> можно установить подчеркнутое начертание текстового фрагмента, который ограничивают данные тэги, а с помощью пары тэгов <tt></tt> -отобразить текст телетайпным шрифтом.
После того, как вы просмотрите полученный результат, увеличим размер шрифта текста. Это можно сделать разными способами.
Тэги <big></big> увеличивают размер шрифта текста, заключенного между ними.
Добавьте в начало и конец вышеуказанного фрагмента кода соответственно тэги <big> и </big> так, чтобы элемент принял следующий вид:
<big><b><i> Здесь Вы узнаете о нашей деятельности, о наших интересах и увлечениях, о наших успехах и достижениях </i></b></big>
С помощью тэгов <small></small> вы можете уменьшить размер шрифта текста по сравнению с исходным.
Другой способ указания размера шрифта - с помощью тэгов <font></font> с атрибутом size. В качестве значений этого атрибута используются целые числа от 1 до 7. Причем значение 1 соответствует минимальному размеру шрифта, а значение 7 - максимальному.
В качестве значения атрибута size можно также использовать числа от 1 до 7 со знаком + (плюс) или - (минус). В этом случае размер шрифта соответственно увеличивается или уменьшается, по сравнению с исходным, например, тэги <font size=+1></font> увеличат размер шрифта, по сравнению с текущим, на один порядок.
В тэгах <font></font> может использоваться также атрибут color для указания цвета шрифта, ограниченного тэгами текста. Значения этого атрибута такие же, как и для рассмотренных ранее атрибутов, описывающих цвет фона и текста документа.
По умолчанию абзац с текстом Здесь Вы узнаете... выровнен влево. Центрируем его по горизонтали с помощью тэгов <center></center>. Вы можете также выровнять абзац по правому краю страницы с помощью тэгов <right></right> или по левому - с помощью тэгов <left></left>.
Вставьте тэги <center></center>, ограничив ими указанный абзац так, чтобы код HTML принял следующий вид:
<html>
<head>
<title>Лицей № 1548</title>
</head>
<body bgcolor=blue text=yellow>
<h1 align=center>Добро пожаловать на страничку лицея № 1548!</h1>
<center><font size=5><b><i>Здесь
Вы узнаете о нашей деятельности, о наших
интересах и увлечениях, о наших успехах
и достижениях</i></b></font><
</body>
</html>
В окне браузера документ будет выглядеть примерно так, как это показано на рис. 1.
Язык HTML допускает два подхода к шрифтовому выделению фрагментов текста. С одной стороны, можно прямо указать, что шрифт на некотором участке текста может быть полужирным или курсивным, т.е. явно указать начертание шрифта текста, как мы это делали в данном опыте. С другой стороны, можно пометить любой фрагмент текста, как имеющий некий, отличный от нормального, логический стиль, предоставив интерпретацию этого стиля браузеру. Таким образом, логический стиль указывает роль текстового фрагмента, например, большую значимость по сравнению с обычным текстом или то, что данный фрагмент является цитатой. В своей работе вы можете использовать следующие тэги, определяющие логические стили. Проверьте, как они работают в разных браузерах.
<dfn></dfn> - применяется для определения слова. Текст обычно выводится курсивом.
<em></em> - для выделения слов и усиления. Отображается курсивом.
<cite></cite> - для выделения названий книг, фильмов, спектаклей и т.д. Выводится курсивом.
<code></code> - для фрагментов кода программ. Показывается на экране шрифтом фиксированной ширины.
<kbd></kbd> - используется для текста, который пользователь вводит с клавиатуры. В разных браузерах может отображаться разными шрифтами.
<samp></samp> - служит для отображения сообщений программ. Выводится шрифтом фиксированной ширины.
<strong></strong> - для особо важных фрагментов. Обычно выделяется полужирным начертанием.
<var></var> - используется для указания, что часть текста или слово является символьной переменной, т.е. текстом, который может быть заменен различными выражениями. Отображается курсивом.
2.2.Вставка иллюстраций
На каждую Web-страницу можно поместить любое количество иллюстраций. Вы можете использовать готовые графические изображения или создать их сами. Здесь мы посмотрим, как вставить в Web-документ уже готовый рисунок.
Графические изображения, которые вы вставляете в свои Web-документы, должны быть созданы в таком графическом формате, который поддерживается браузером. Стандартные форматы Web-графики - GIF, JPG и PNG. Размеры их файлов минимальны по сравнению с другими форматами, что значительно сокращает время загрузки из сети.
Вставим на первую страницу нашего сайта рисунок МИР.JPG, который обычно находится в папке Windows, т.е. той папке, в которой установлена операционная система Windows. Прежде всего, этот файл следует скопировать в папку Web, которую мы создали для хранения файлов сайта.
Скопируйте файл МИР.JPG или любой другой файл с расширением .JPG или .GIF из папки Windows в папку Web.
Для вставки изображения в Web-документ используется одиночный тэг <img> с атрибутом src, значение которого соответствует имени вставляемого файла или его адресу в Интернете. С помощью необязательного атрибута <border> можно включить отображение рамки вокруг рисунка. Значение 1 для этого атрибута создаст рамку толщиной 1 пиксел. Таким образом, тэг, вставляющий рисунок, должен выглядеть следующим образом:
<img src=МИР.JPG border=1>
Вставим его после заголовка Добро пожаловать на страничку лицея № 1548!
Операционная система Windows не различает регистр букв в названиях имен файлов, но операционные системы семейства Unix различают его, поэтому следует тщательно следить за тем, чтобы имя файла в тэге указывалось с соблюдением регистра. Начинающие Web-дизайнеры часто недоумевают: почему рисунок был виден на странице при тестировании на локальном компьютере и не появляется при загрузке страниц с удаленного сервера. А все дело в том, что они указали Мир.jpg, а на диске хранится МИР.JPG.
Вставьте пустую строку после элемента <h1 align=center>Добро пожаловать на страничку лицея № 1548!</h1> и введите в ней тэг <img src=МИР.JPG border=1> для включения изображения в документ.
Чтобы выровнять рисунок по центру, следует, воспользовавшись тэгами <center></center>, записать строку кода HTML, вставляющего рисунок, следующим образом:
<center><img src=МИР.JPG border=1</center>
Ограничим размер рисунка по ширине 300 пикселами, а по высоте – 400 пикселами: <center><img src= МИР.JPG border=1 Widht=300 height=400></center>
Так же, при создании WEB – страниц используются таблицы, гипертекстовые ссылки, формы, списки.
Заключение
Глобальная компьютерная сеть Интернет
развивается очень
По прогнозам специалистов через десять лет около 50 процентов семей (безусловно, пока лишь в развитых странах) будут ежедневно пользоваться услугами Интернета. Это будет время, когда любой человек, владеющий компьютером, сможет "скачать" с его помощью статьи, иллюстрации, видео- или аудиоинформацию по любой интересующей его теме. Он сможет получить эту информацию тогда, когда он этого пожелает. Через какое-то время системы искусственного интеллекта – параллельный машинный перевод, а также идентификация и распознавание голоса сломают последние национальные и языковые барьеры и сделают возможным свободный транснациональный обмен информацией.
Информация о работе Контрольная работа по дисциплине Информационные технологии в социальной сфере