База знаний студента. Реферат, курсовая, контрольная, диплом на заказ

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

Лабораторные работы по компьютерным сетям — Компьютерные сети

ЛАБОРАТОРНАЯ РАБОТА №1

Тема работы: Диагностика IP-протокола.

Цель работы: Научиться проверять работоспособность сетевого подключения.

Теоретическая часть: Существуют различные утилиты, позволяющие быстро продиагностировать IP-подключение. Однако большинство операций легко может быть выполнено с использованием команд самой операционной системы.

Пользователи Windows XP для диагностики сетевого подключения могут воспользоваться специальным мастером. Эта программа вызывается из меню задачи Сведения о системе (Пуск > Все программы > Стандартные > Служебные > Сведения о системе > меню Сервис > Диагностика сети):

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

Ход работы:

Ipconfig

Для отображения параметров IP-протокола используются утилиты ipconfig (Windows NT/2000/XP) и winipcfg (Windows 9x). Эта утилита выводит на экран основные параметры настройки протокола TCP/IP: значения адреса, маски, шлюза.

1.      Пуск, выберите строку меню Выполнить, наберите символы cmd и нажмите клавишу Enter на клавиатуре.

2.      ipconfig /all. При нормальной работе компьютера на экран должен вывестись примерно такой листинг: 

Windows IP Configuration
        Host Name . . . . . . . . . . . . : vest
        Primary Dns Suffix  . . . . . . . : tvs.tomsk.ru
        Node Type . . . . . . . . . . . . : Hybrid
        IP Routing Enabled. . . . . . . . : No
        WINS Proxy Enabled. . . . . . . . : No
        DNS Suffix Search List. . . . . . : tvs.tomsk.ru
                                            tomsk.ru
Ethernet adapter Local Area Connection:
        Connection-specific DNS Suffix  . : tvs.tomsk.ru
        Description . . . . . . . . . . . : Intel(R) PRO/100 S Desktop Adapter
        Physical Address. . . . . . . . . : 00-02-B3-8D-44-53
        Dhcp Enabled. . . . . . . . . . . : Yes
        Autoconfiguration Enabled . . . . : Yes
        IP Address. . . . . . . . . . . . : 83.172.10.54
        Subnet Mask . . . . . . . . . . . : 255.255.255.0
        Default Gateway . . . . . . . . . : 83.172.10.254
        DHCP Server . . . . . . . . . . . : 83.172.10.2
        DNS Servers . . . . . . . . . . . : 192.168.0.1
                                            83.172.10.2
        Primary WINS Server . . . . . . . : 83.172.10.2
        Secondary WINS Server . . . . . . : 213.183.109.3
        Lease Obtained. . . . . . . . . . : 24 августа 2004 г. 9:40:41
        Lease Expires . . . . . . . . . . : 27 октября 2004 г. 9:40:41

Отключите сетевое подключение, повторите команду. При отсутствующем соединении на экран выводится примерно такой листинг: 

Windows IP Configuration
        Host Name . . . . . . . . . . . . : vest
        Primary Dns Suffix  . . . . . . . : tvs.tomsk.ru
        Node Type . . . . . . . . . . . . : Hybrid
        IP Routing Enabled. . . . . . . . : No    
        WINS Proxy Enabled. . . . . . . . : No
        DNS Suffix Search List. . . . . . : tvs.tomsk.ru
                                            tomsk.ru    
Ethernet adapter Local Area Connection:
        Media State . . . . . . . . . . . : Media disconnected
        Description . . . . . . . . . . . : Intel(R) PRO/100 S Desktop Adapter
        Physical Address. . . . . . . . . : 00-02-B3-8D-44-53

Обратите внимание, что программа вывела на экран только данные о "физических" параметрах сетевой карты и указала, что отсутствует подключение сетевого кабеля (Media disconnected).

В составе Windows 95/98/ME существует программа, которая в графическом режиме показывает основные настройки протокола TCP/IP:

Это winipcfg. Для вызова программы следует набрать ее имя в командной строке и нажать клавишу Enter (это возможно только в том случае, если Вы работаете с ОС Windows 95/98/ME).

Ping

Команда используется для проверки протокола TCP/IP и достижимости удаленного компьютера. Она выводит на экран время, за которое пакеты данных достигают заданного в ее параметрах компьютера.

  1. Проверка правильности установки протокола TCP/IP. Откройте командную строку и выполните команду:

ping 127.0.0.1

Адрес 127.0.0.1 — это личный адрес любого компьютера. Таким образом, эта команда проверяет прохождение сигнала "на самого себя". Она может быть выполнена без наличия какого-либо сетевого подключения. Вы должны увидеть приблизительно следующие строки: 

Pinging 127.0.0.1 with 32 bytes of data:
Reply from 127.0.0.1: bytes=32 time<1ms TTL=128
Reply from 127.0.0.1: bytes=32 time<1ms TTL=128
Reply from 127.0.0.1: bytes=32 time<1ms TTL=128
Reply from 127.0.0.1: bytes=32 time<1ms TTL=128
Ping statistics for 127.0.0.1:
    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss),
Approximate round trip times in milli-seconds: 
    Minimum = 0ms, Maximum = 0ms, Average = 0ms

По умолчанию команда посылает пакет 32 байта. Размер пакета может быть увеличен до 65 кбайт. Так можно обнаружить ошибки при пересылке пакетов больших размеров. За размером тестового пакета отображается время отклика удаленной системы (в нашем случае — меньше 1 миллисекунды). Потом показывается еще один параметр протокола — значение TTL. TTL — "время жизни" пакета. На практике это число маршрутизаторов, через которые может пройти пакет. каждый маршрутизатор уменьшает значение TTL на единицу. При достижении нулевого значения пакет уничтожается. Такой механизм введен для исключения случаев зацикливания пакетов.

Если будет показано сообщение о недостижимости адресата, то это означает ошибку установки протокола IP. В этом случае целесообразно удалить протокол из системы, перезагрузить компьютер и вновь установить поддержку протокола TCP/IP.

  1. Проверка видимости локального компьютера и ближайшего компьютера сети. Выполните команду

ping 192.168.0.19

На экран должны быть выведены примерно такие строки: 

Pinging 212.73.124.100 with 32 bytes of data:
Reply from 192.168.0.19: bytes=32 time=5ms TTL=60
Reply from 192.168.0.19: bytes=32 time=5ms TTL=60
Reply from 192.168.0.19: bytes=32 time=4ms TTL=60
Reply from 192.168.0.19: bytes=32 time=4ms TTL=60
Ping statistics for 212.73.124.100:
    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss),
Approximate round trip times in milli-seconds:
    Minimum = 4ms, Maximum = 5ms, Average = 4ms

Наличие отклика свидетельствует о том, что канал связи установлен и работает.

 

 

Tracert

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

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

  1. В командной строке введите команду:

tracert 192.168.0.19

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

Tracing route to 192.168.0.19
over a maximum of 30 hops:
  1    <1 ms    <1 ms    <1 ms  192.168.0.19 
  
Trace complete.


Route


  Команда Route
позволяет просматривать маршруты прохождения сетевых пакетов при передаче
информации.  


    
 
  1. Выведите
     на экран таблицу маршрутов TCP/IP, для этого в командной строке
     введите команду route print. 
    2. 





Net view


Выводит список доменов, компьютеров или общих ресурсов на данном компьютере.
Вызванная без параметров, команда net view выводит список компьютеров в
текущем домене.


1.     
net view  и
вы увидите список компьютеров своей рабочей группы.


2.      net view \192.168.0.250  для
просмотра общих ресурсов  расположенных
на компьютере 192.168.0.250


Net send


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


1.     
net send 192.168.0.1 Привет. Проверка связи.


Ваше
сообщение получит пользователь 192.168.0.1


2.      net send * Привет. Проверка связи.


Ваше
сообщение получат все пользователи рабочей группы.


 


ЛАБОРАТОРНАЯ РАБОТА №2


Тема работы: Создание HTML-документа.


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


Теоретическая часть: HTML-документ — это просто текстовый файл с
расширением *.htm или *.html). 

Вот самый простой HTML-документ: 


 
      
           </pre><pre>               Лабораторная 2. Пример 1.</pre><pre>          
      
      
          
 
               Привет! 
           
          
 
               Это простейший пример HTML-документа. 
          
 
          
 
               Этот html-файл может быть одновременно открыт 
               и в блокноте, и в Internet Explorer'е. Сохранив изменения в  
               блокноте, просто нажмите кнопку Reload ('перезагрузить') в 
               Explorer'е, чтобы увидеть эти изменения. 
          
 
      


Вы можете посмотреть этот пример прямо сейчас. 


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


 
 
Лабораторная 2. Пример 1. 
 
 
Привет!
 
Это простейший пример HTML-документа.
 
Этот html-файл может быть одновременно открыт и в блокноте, и в Internet Explorer'е. Сохранив изменения в блокноте, просто нажмите кнопку Reload ('перезагрузить') в Explorer'е, чтобы увидеть эти изменения.
 
 


Как видно из примера, вся информация о форматировании документа
сосредоточена в его фрагментах, заключенных между знаками "<" и
">". Такой фрагмент (например, )
называется меткой (по-английски — tag, читается "тег"). 


Большинство HTML-меток — парные, то есть на каждую открывающую метку вида  есть закрывающая метка вида  с тем же именем, но с
добавлением "/". 


Метки можно вводить как большими, так и маленькими буквами. Например, метки ,  и 
будут восприняты браузером одинаково. 


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


Ход работы: 


Создание простейших файлов HTML. 


    
 
  1. Создайте папку, в которой
     Вы будете сохранять созданные Web-страницы. 
    2. 
 
  2. Запустите стандартную
     программу Блокнот (Notepad) и наберите следующий текст с элементами
     форматирования: 
    3. 



 Учебный файл HTML 
Расписание занятий на вторник


    
 
  1. Сохраните файл под именем
     schedule.html. 
    2. 
 
  2. Для просмотра созданной
     Web-страницы загрузите броузер Microsoft Internet Explorer. 
    3. 
 
  3. Откройте в меню броузера
     Файл (File), Открыть (Open), Просмотр(Обзор — Browse) и найдите созданный
     ранее файл schedule.html, загрузите его. Убедитесь, что название
     Web-страницы (Учебный файл HTML) отразилось в верхней статусной
     строке броузера. 
    4. 



Управление расположением текста на экране. 


    
 
  1. Внесите изменения в
     текст, расположив слова "Расписание", "занятий",
     "на вторник" на разных строках: 
    2. 



 Учебный файл HTML 
Расписание
занятий
на вторник


    
 
  1. Сохраните внесенные
     изменения, с помощью команд Файл (File), Сохранить (Save). 
    2. 
 
  2. Просмотрите с помощью
     броузера Microsoft Internet Explorer новую полученную Web-страницу
     используя клавишу F5 или с помощью кнопки Обновить (Refresh). 
    3. 



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

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


    
 
  1. Внесите изменения в текст
     файла HTML: 
    2. 



 Учебный файл HTML 
Расписание 
занятий 
на вторник


Сохраните внесенные изменения в файле schedule.html.
Просмотрите с помощью броузера обновленную страницу. 


Выделение фрагментов текста. 


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


    
 
  1. Внесите изменения в файл schedule.html:
     
    2. 



 Учебный файл HTML 
Расписание занятий  на вторник


    
 
  1. Посмотрите новую
     полученную Web-страницу. 
    2. 
 
  2. Попробуейте использовать
     вложение тегов:
    
     Расписание
     занятий  на вторник 
    3. 



Изменение размера текста 


      Существует два способа управления
размером текста, отображаемого  


       броузером: 


o       



o       



1.Внесите изменения в файл schedule.html: 


 Учебный файл HTML 
Расписание
 занятий на вторник


    
 
  1. Просмотрите обновления
     через браузер. 
    2. 
 
  2. Внесите следующие изменения  в файл schedule.html: 
    3. 



 Учебный файл HTML 
Расписание занятий на вторник


    
 
  1. Самостоятельно измените
     размер шрифта для текста "занятия на вторник", используя тег
     . 
    2. 



Гарнитура и цвет шрифта 


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


Для изменения цвета шрифта в теге 
можно использовать атрибут COLOR="X". Вместо Х надо подставить либо
название цвета (в кавычках), либо его шестнадцатеричное значение. При задании
цвета шестнадцатеричным числом можно представить этот цвет разложенным на три
составляющие: красную(R), зеленую (G), синюю (B), каждая из которых имеет
значение от 0 до FF. Примеры записи цвета в формате RGB приведены в таблице: 



 

  
  
Цвет

  		
  
  
RRGGBB

  		
 

 

  
  
black | черный

  		
  
  
000000

  		
 

 

  
  
white | белый

  		
  
  
FFFFFF

  		
 

 

  
  
red | красный

  		
  
  
FF0000

  		
 

 

  
  
green | зеленый

  		
  
  
00FF00

  		
 

 

  
  
azure | бирюзовый

  		
  
  
00FFFF

  		
 

 

  
  
blue | синий

  		
  
  
0000FF

  		
 

 

  
  
gray | серый

  		
  
  
A0A0A0

  		
 

 

  
  
purple | фиолетовый

  		
  
  
FF00FF

  		
 

 

  
  
yellow | желтый

  		
  
  
FFFF00

  		
 

 

  
  
brown | коричневый

  		
  
  
996633

  		
 

 

  
  
orange | оранжевый

  		
  
  
FF8000

  		
 

 

  
  
violet | лиловый

  		
  
  
8000FF

  		
 




    
 
  1. Внесите изменения в файл schedule.html:
     
    2. 



 Учебный файл HTML 
Расписание
занятий на вторник


2.                 



Выравнивание текста по горизонтали 


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


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


    
 
      
  
    • ALIGN=CENTER —
      Выравнивание по центру 
      • 
  
    • ALIGN=RIGHT —
      Выравнивание по правому краю 
      • 
  
    • ALIGN=LEFT —
      Выравнивание по левому краю 
      • 
 
    



1.Внесите изменения в файл schedule.html: 


 Учебный файл HTML 
Расписание
занятий на вторник


    
 
  1. Просмотрите обновления 
    2. 



Задание цвета фона и текста 


Цвета фона и текста документа
устанавливаются в начале файла HTML в теге . Атрибут BGCOLOR=
задает цвет фона страницы, TEXT= определяет цвет текста для всей страницы,
LINK= и VLINK= определяют цвета соответственно непросмотренных и просмотренных
ссылок. 


    
 
  1. Внесите изменения в файл schedule.html:
     
    2. 



 Учебный файл HTML 
Расписание
занятий на вторник


Задание на самостоятельное
выполнение. 


    
 
  1. Проведите
     экспериментальную работу с созданным документом. Меняя размеры окна,
     посмотрите, как броузер показывает текст с принудительным разрывом строк.
     Что происходит, когда окно уменьшается настолько, что в нем не может
     поместиться целиком даже одно слово? 
    2. 
 
  2. Самостоятельно создайте
     собственный HTML-документ. Пусть это будет небольшой рассказ о себе и
     своих увлечениях. 
    3. 






ЛАБОРАТОРНАЯ РАБОТА №3


Тема работы: Размещение графики на Web-странице.


Цель работы: Научиться внедрять в html-документ графические
изображения.


Теоретическая часть: Одна из наиболее привлекательных черт Web —
возможность включения ссылок на графические и иные типы данных в HTML-документ.
Делается это при помощи тега . Использование этого тега позволяет
значительно улучшить внешний вид и функциональность документов. 


Существует два способа использования графики в HTML-документах. Первый — это
внедрение графических образов в документ, что позволяет пользователю видеть
изображения непосредственно в контексте других элементов документа. Это
наиболее используемая техника при проектировании документов, называемая иногда
"inline image". Синтаксис тега: 


text



Элементы синтаксиса тега: 


URL 


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


ALT="text" 


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


HEIGTH=n1 


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


WIDTH=n2 


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


ALIGN 


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


С версии HTML 2.0 у тега  появились дополнительные параметры: 


text 


Новые параметры: 


BORDER 


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


VSPACE 


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


HSPACE 


То же самое, что и VSPACE, но только по
горизонтали. 


Фоновые рисунки 


Большинство броузеров позволяет включать в документ фоновый рисунок, который
будет отображаться на фоне всего документа.Описание фонового рисунка включается
в тег BODY и выглядит следующим образом: 


 


Ход работы: 


Размещение графики
на Web-странице. 




Графика в Web, как правило, распространяется в трех форматах: GIF, JPG, PNG.
Перед выполнением упражнения поместите файл schedule.jpg в ту
же папку, которая будет использована для хранения создаваемой Web-страницы. 


    
 
  1. Внесите изменения в файл schedule.html
     (если файл утрачен, создайте новый): 
    2. 



 Учебный файл HTML 
Расписание
занятий на вторник



    
 
  1. Самостоятельно внесите
     изменения в файл schedule.html, опробовав использование таких
     атрибутов графики как ALT, BORDER, HEIGHT, WIDTH. Пример использования
     атрибутов приведен в таблице ниже: 
    2. 




 

  
  
Атрибут

  		
  
  
Формат

  		
  
  
Описание

  		
 

 

  
  
ALT

  		
  
  
картина

  		
  
  
Надпись "картинка" выводится на экран при
  подведении указателя мыши к изображению.

  		
 

 

  
  
BORDER

  		
  
  

  		
  
  
Задает рамку вокруг изображения толщиной 3 пикселя.

  		
 

 

  
  
ALIGN

  		
  
  

  		
  
  
Выравнивает изображение относительно текста по верхней
  границе текста.

  		
 

 

  
  
HEIGHT

  		
  
  

  		
  
  
Вертикальный размер изображения принудительно
  устанавливается в 111 пикселей.

  		
 

 

  
  
WIDTH

  		
  
  

  		
  
  
Горизонтальный размер изображения принудительно
  устанавливается в 220 пикселей.

  		
 

 

  
  
VSPACE

  		
  
  

  		
  
  
Атрибут добавляет верхнее и нижнее пустые поля высотой 8
  пикселей.

  		
 

 

  
  
HSPACE

  		
  
  

  		
  
  
Добавляет левое и правое пустые поля шириной 8 пикселей.

  		
 




 


Фоновое
отображение графики на Web-странице 


    
 
  1. Поместите файл back.jpg в ту же
     папку, что и schedule.html. 
    2. 
 
  2. Внесите изменения в файл schedule.html:
     
    3. 



 Учебный файл HTML 
Расписание
 занятий на вторник



На экране вы увидите: 




В действительности же графический файл back.jpg
выглядит так: 




Линейки и буквицы



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

Во-первых, это различные графические разделители, обычно горизонтальные,
применяемые вместо горизонтальной черты (
). 


Вот так он выглядит в окне браузера: 






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




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

 




    
 
  1. Разместите в Вашем
     документе schedule.html разделитель anim_hr.gif. 
    2. 
 
  2. Задайте этому изображению
     высоту, равную 2 пикселям. 
    3. 
 
  3. Сместите анимированный
     разделитель в центр документа. 
    4. 
 
  4. В слове Расписание
     замените букву Р изображением, взять его Вы можете в папке с
     лабораторными работами(файл  r.gif ). 
    5. 
 
  5. Изменяя значение атрибута
     ALIGN, добейтесь наилучшего расположения буквы на экране. 
    6. 
 
  6. Используя любой графический
     редактор, создайте свое, альтернативное, изображение буквы Р и
     встройте его в документ. 
    7. 



Графические
маркеры. 


Язык HTML позволяет создавать
маркированные и нумерованные списки. 


Пример маркированного списка: 


    
 
      
  
    • элемент списка 
      • 
  
    • элемент списка 
      • 
  
    • ... 
      • 
  
    • элемент списка 
      • 
 
    



В терминах языка HTML это выглядит так: 


  • элемент списка
  • элемент списка
  • ...
  • элемент списка
    • 

    Пример нумерованного списка: 
    

    5.    

    

    6.    

    

    7.    

    

    8.    

    

    В терминах языка HTML это выглядит так: 
    

    1. элемент списка
    2. элемент списка
    3. ...
    4. элемент списка
      5. 

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

        
 
      1. Сначала надо создать
     такой треугольник в любой программе либо скопировать уже готовый из папки
     с лабораторными работами(файл  marker.gif ).. 
        2. 
 
      2. Этот файл нужно поместить
     рядом с уже созданным файлом schedule.html. 
        3. 
 
      3. Теперь введем в тег
     
           атрибут STYLE= (этот атрибут подробнее мы рассмотрим при
     изучении CSS — Cascading Style Sheets): 

      

         
        

        Ваш список должен выглядеть так: 
        

          
 
            
  
          • элемент списка 
            • 
  
          • элемент списка 
            • 
  
          • ... 
            • 
  
          • элемент списка 
            • 
 
          

        

        Обратите внимание на то, что при указании имени
файла мы заключили его не в обычные двойные кавычки, а в одинарные. Это сделано
потому, что все значение атрибута STYLE= заключено в двойные кавычки. 
        

        Оформление кнопок.

        

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

          
 
        1. Чтобы создать кнопку,
     поместите в Ваш html-документ следующий код: 
          2. 

        

         
        

        В браузере она должна выглядеть так: ЭТO
KHОПKА 
        

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

          
 
        1. Скопируйте изображение home-button.gif  из папки с лабораторными работами ,
     поместите его в ту же папку, что и файл schedule.html. 
          2. 
 
        2. Замените текст ЭТO
     KHОПKА на описание тега , указывающего на файл
     home-button.gif. 
          3. 
 
        3. В тег 
          4.