
- •Сетевые информационные технологии
- •1.2. Порт последовательной передачи данных (rs-232)
- •1.3. Связь двух компьютеров стандартными программными средствами
- •2. Аппаратное и программное обеспечение
- •3. Домашнее задание
- •4. Порядок выполнения работы
- •5. Содержание отчета
- •6. Контрольные вопросы и задания
- •Лабораторная работа n 2 поДготовка текстового документа в формате html цель работы
- •1. Пояснения к работе
5. Содержание отчета
Цель работы.
Детализированные схемы алгоритмов и тексты программ.
Полное имя и длина файла, использованного при измерении скорости передачи с использованием NC, а также значение эффективной скорости передачи.
Результаты измерений по пунктам 2, 4 и 5 – для 1-го и 2 – для 2-го и 3-го вариантов.
6. Контрольные вопросы и задания
Изобразите модель взаимодействия открытых систем OSI.
В чем состоит назначение каждого из уровней модели OSI?
Аргументировано соотнесите аппаратное и программное (использованное и разработанное) обеспечение с уровнями модели OSI.
Поясните сущность асинхронной передачи данных через последовательный порт.
Что такое протокол передачи данных?
Что такое контроль на чётность (нечётность)?
Что такое скорость и эффективная скорость передачи данных?
Каков порядок организации связи через последовательный порт RS-232?
Поясните работу всех операторов составленных программ.
Лабораторная работа n 2 поДготовка текстового документа в формате html цель работы
Изучение языка разметки гипертекста HTML и создание web−страницы
1. Пояснения к работе
Универсальный язык разметки гипертекста html (hyper text markup language) нашёл самое широкое распространение для представления в www (world wide web) web-страниц, электронных книг, презентаций и др.
Html не является языком программирования, так как он не содержит команд – главной компоненты любого языка программирования. Файлы с html −кодом представляют собой обычные текстовые файлы, которые может прочитать как человек, так и компьютер. Благодаря этому, разрабатывать Web-страницы можно в любой операционной системе, используя разнообразные приложения (Word, Far, NotePad, Windows Commander и др.).
Для просмотра Web-страниц, написанных на html, могут использоваться, например, браузеры типов Internet Explorer, Netscape Navigator или Opera. Для того чтобы браузер воспринимал содержимое текстового файла как html−код, его расширение должно быть .html или .htm.
Гипертекстовый документ состоит из заголовка head и тела body документа. Ниже на рис.1 приведён пример простейшего гипертекста и соответствующая ему web-страница.
Html является описательным языком разметки документов, в нем используются указатели разметки (теги). Теговая модель описывает документ как совокупность контейнеров, каждый из которых начинается и заканчивается тегами, то есть документ html представляет собой обычный АSСII−файл, с добавленными в него управляющими html−кодами (тегами). Текст тега заключается в угловые скобки ("<" и ">").
Для ряда тегов характерно наличие атрибутов, которые могут иметь конкретные значения, устанавливаемые для изменения функции тега. Атрибуты тега следуют за именем и отделяются друг от друга одним или несколькими знаками табуляции, пробелами или символами возврата к началу строки. Порядок записи атрибутов в теге значения не имеет. Значение атрибута, если таковое имеется, следует за знаком равенства, стоящим после имени атрибута. Если значение атрибута — одно слово или число, то его можно просто указать после знака равенства, не выделяя дополнительно. Все остальные значения необходимо заключать в одинарные или двойные кавычки, особенно если они содержат несколько разделенных пробелами слов. Длина значения атрибута ограничена 1024 символами. Регистр символов в именах тегов и атрибутов не учитывается, чего нельзя сказать о значениях атрибутов. Например, особенно важно использовать нужный регистр при вводе URL (Universe Resource Locator − унифицированный указатель ресурса), других документов в качестве значения атрибута href.
Рис. 1. Гипертекст и соответствующая ему web-страница
Чаще всего элементы разметки html или html−контейнеры состоят из начального и конечного компонентов, между которыми размещаются текст и другие элементы документа. Имя конечного тега идентично имени начального, но перед именем конечного тега ставится косая черта (/) (например, для тега стиля шрифта — курсив <i> закрывающая пара представляет собой </i>, а для тега заголовка <title> закрывающей парой будет </title>). Конечные теги никогда не содержат атрибутов. По своему значению теги близки к понятию скобок "begin/end" в универсальных языках программирования, которые задают области действия имен локальных переменных и т.п. Теги определяют область действия правил интерпретации текстовых документов.
Все теги html по их назначению и области действия можно разделить на следующие основные группы:
определяющие структуру документа;
оформление блоков гипертекста (параграфы, списки, таблицы, картинки);
гипертекстовые ссылки и закладки;
формы для организации диалога;
вызов программ.
Рассмотрим синтаксис тегов некоторых из перечисленных групп.
Теги, определяющие структуру документа:
<html> …Вся страница html… </html>. Этими двумя тегами должна начинаться и заканчиваться web-страница.
<head> …Заголовок… </head>. Заголовок html−документа является необязательным элементом разметки. В него включают тег <title> и др.
<title> …Имя… </title>. Элемент разметки title служит для именования документа в World Wide Web и является необязательным элементом разметки. Роботы многих поисковых систем используют содержание элемента title для создания поискового образа документа. Слова из title попадают в индекс поисковой системы. Из этих соображений элемент title всегда рекомендуется использовать на страницах web-страницы.
<body> …Содержимое html страницы… </body>. Между этими двумя тегами располагается всё, что будет отображено на web-странице. Среди атрибутов тега <body> следует упомянуть bgcolor, который применяется для задания фона web-страницы. Он может, например, принимать значения: aqua, black, blue, gray, green, fuchsia, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow и др.
Теги, оформляющие блоки гипертекста:
<p> …Содержимое абзаца… </p>. Создаётся абзац с пробелами до и после. Использовать закрывающий тег не обязательно, но рекомендуется. У тега <p> может быть всего один, отвечающий за выравнивание текста, аргумент Align, который принимает одно из четырёх значений: Left, Right, Center или Justify.
<h1> …Заголовок… </h1> − <h6> …Заголовок… </h6>. Этот тег делает заголовок жирным. Заголовки уровня 1 – больше, а заголовки уровня 6 – меньше, чем обычный текст. У этого тега может также быть всего один, отвечающий за выравнивание текста, аргумент Align (выравнивание). Align может принимать одно из следующих значений:
left − выравнивание текста по левому краю (по умолчанию);
right − выравнивание текста по правому краю;
center − выравнивание текста по центру.
<br> − разрыв текущей строки и переход на следующую. Это одиночный тег.
<nobr> …Текст… </nobr> − не даёт возможность браузеру разрывать Текст. Если Текст не умещается на экране, то посетителю web-страницы придётся воспользоваться полосой прокрутки; если текст не умещается в колонке, то она расширяется.
<font> …Текст… </font > − устанавливает гарнитуру (шрифт), его цвет и размер шрифта для Текст. Для установления шрифта используется атрибут face. Для задания цвета используют атрибут с форматом color=#RRGGBB (от английских слов Red, Green, Blue), где RR, GG и BB − шестнадцатеричные числа, обозначают яркости каждой составляющей. Вторая форма записи атрибута проще: color=Color, где Color − одно из слов английского языка, обозначающего цвет. Размер указывается цифрами от 1 до 7 − для этого применяют атрибут size. По умолчанию обычно стоит 3. Пример. <font size=6 face=Arial color=#0000ff> Структура гипертекстовой сети </font>.
<b> …Текст… </b> или <strong> …Текст… </strong> − пишет Текст жирно.
<i> …Текст… </i> или <em> …Текст… </em> − пишет Текст наклонно.
<u> …Текст… </u> − подчёркивает Текст.
<hr> − отображает горизонтальную линию поперёк текста;
<!-- …Текст… --> − браузер рассматривает Текст как комментарий и не выводит его на экран.
<ol> …Список… </ol>, <li> …Элемент списка… </li>. Эти две пары тегов отображают нумерованный список. У тега <ol> могут быть два атрибута: start и type. Первый из них задает первый номер списка (по умолчанию 1), а второй – выбирает систему нумерации (возможные значения: A – большими латинскими буквами, a – малыми латинскими буквами, I – большими римскими цифрами, i – малыми римскими цифрами, 1 – арабскими цифрами).
<ul> …Список… </ul>, <li> …Элемент списка… </li>. Эти две пары тегов отображают маркированный список. У тега <ul> может быть только один атрибут − type. Он может принимать одно из тёх значений: circle, disc и square.
<img> − отображает рисунок формата GIF, JPEG или PNG. Тег имеет следующие атрибуты:
src − его значение задаёт имя файла, в котором находится изображение, и путь к нему. Задавая путь, нужно руководствоваться правилами, принятыми для записи URL. В частности, имена папок и файлов разделяются прямыми косыми чертами, а строчные и прописные буквы различаются;
width и height − определяют высоту и ширину изображения в пикселях или процентах от размера окна (в последнем случае надо указывать символ %);
align − используется для выравнивания картинки относительно текста по горизонтали (значения left и right) вертикали (значения: absbottom, absmiddle, baseline, bottom, middle, texttop и top). Для отмены обтекания изображения текстом применяют тег <br> с атрибутом clear, который может принимать значения: right, left и all;
alt − используется для снабжения изображений комментирующими надписями, которые появляются рядом с указателем мыши, наведённым на изображение;
border − определяет толщину чёрной рамки картинки в пикселях (по умолчанию толщина равна 2);
hspace и vspace − определяют горизонтальный и вертикальный отступы между изображением и текстом в пикселях;
<table> …Таблица…</table> − создают таблицу. Таблица состоит из строк, а строки состоят из столбцов. Тег <table> имеет следующие атрибуты:
align − определяет горизонтальное выравнивание таблицы относительно окна;
bgcolor − определяет цвет фона;
border − определяет толщину рамки в пикселях (по умолчанию 0);
bordercolor − определяет цвет рамки;
cellpadding − определяет расстояние между рамкой и содержимым ячейки таблицы в пикселях;
cellspacing − определяет расстояние между рамками ячеек;
height – определяет минимальную высоту таблицы;
width – определяет минимальную ширину таблицы.
<caption> …Заголовок таблицы… </caption> − добавляют к таблице её заголовок.
<tr> …Содержимое строки… </tr> − задают содержимое строки. Тег имеет следующие атрибуты: align, bgcolor, bordercolor, height, width и др. Перечисленные атрибуты выполняют те же функции, что и для тега <table>, но уже для строки таблицы.
<td> …Содержимое столбца… </td> − задают содержимое столбца. Тег имеет следующие атрибуты: align, bgcolor, bordercolor, height, width и др. Перечисленные атрибуты выполняют те же функции, что и для тега <table>, но уже ячейки таблицы. Атрибуты colspan и rowspan позволяют объединять столбцы и строки соответственно.
Пример использования тегов <table> </table>, <caption> </caption>, <tr> </tr> и <td> </td> показан ниже на рис. 2.
Рис. 2. Гипертекст с таблицей и соответствующая ему web-страница
Теги, обеспечивающие гиперссылки:
<a> …Гиперссылка… </a> − обеспечивает гиперссылку на другую страницу или файл. Пример. <a href=second.htm>Запустите второй html-документ</a> − отображается подчёркнутая гиперссылка (Запустите второй html-документ) на Web-страницу с названием second.htm в том же каталоге.
Пример того, как работают рассмотренные выше теги, может дать рис. 3.
Структура гипертекстовой сети задается гипертекстовыми ссылками. Гипертекстовая ссылка − это адрес другого HTML−документа или информационного ресурса Internet, который тематически, логически или каким-либо другим способом связан с документом, в котором ссылка определена. Абзац выделяется не “красной строкой”, а большими интервалами между строками.
Рис. 3. Гипертекст и соответствующая ему web-страница
2. АППАРАТНОЕ И ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ
ПЭВМ класса IBM PC или выше
Браузер типа Internet Explorer или Opera
Текстовый редактор типа Far, Блокнот и им подобные
3. Домашнее задание
Ознакомится с настоящими методическими указаниями.
Подготовить HTML-код для, предложенной преподавателем, web-страницы.
4. ПОРЯДОК ВЫПОЛНЕНИЯ РАБОТЫ
Исследовать работу каждого тега и его атрибутов.
Разработать, предложенную преподавателем, web-страницу.
5. Контрольные вопросы и задания
Какова структура HTML-документа?
Каков общий порядок записи тега и его атрибутов?
Перечислите основные группы тегов.
Поясните порядок применения изученных тегов.
Литература
Фролов А.В., Фролов Г.В. Аппаратное обеспечение персонального компьютера. – М.: Диалог-МИФИ, 1997. – 304 с.
Язык «Си» для профессионалов. По материалам книги Г. Шилдта. – М.: И.В.К.-СОФТ, 1992. – 319 с.
Левкин Г.Н., Левкина В.Е. Демо Турбо Си. 98 тем для начинающего программиста. - М.: Прок, 1992. - 200 с.
Подбельский В.В. Язык Си++. Учеб. пособие. - 2-е изд., перераб. и доп. - М.: Финансы и статистика, 1996. - 560 с.
Березин Б.И., Березин С.Б. Начальный курс С и С++. - М.: ДИАЛОГ-МИФИ, 1996. - 288 с.
Бочков С.О., Субботин Д.М. Язык программирования Си для персонального компьютера. - М.: Радио и связь, 1990. - 384 с.
Анисимов В.А., Денисов В.В. Вычислительные сети и системы телекоммуникации. Методические указания к лабораторным работам для студентов III курса дневного и заочного обучения факультета Бизнеса, специальность 351400. – Новосибирск, НГТУ, 2003 г. – 37 с.
Полонская Е.Л. Язык HTML. Самоучитель.: – М.: Издательский дом “Вильямс”, 2004. – 320 с.
Хан Харли Эффективный самоучитель работы в Internet: Пер. с англ./Хан Харли. К.: Издательство «ДиаСофт», 2001. 448 с.
Шапошников И.В. Самоучитель HTML 4/ СПб.: БХВ-Петербург, 2003. 288 с.
Пособие по HTML v 1.0. http://egorix.net.ru/html/index.html
http://www.intuit.ru/ сайт Интернет университета информационных технологий.
http://www.citforum.ru/internet/ информация по Internet технологиям.