Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
ПОКС практич, ПКС.doc
Скачиваний:
13
Добавлен:
25.11.2019
Размер:
3.19 Mб
Скачать

5. Порядок выполнения работы:

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

5.2 Запустите Блокнот.

5.3 Наберите HTML – код своей программы.

5.4 Сохраните свой документ с расширением *.html, для чего в меню файл выберите команду Сохранить как... Из перечня Тип файла выберите Все файлы.

5.5 Откройте свой файл и просмотрите результат.

6. Контрольные вопросы:

6.1 Как организовываются ссылки из карты - изображения?

6.2 Как поменять размеры изображения?

ПРИЛОЖЕНИЕ:

Чтобы разбить картинку на несколько "горячих" областей, лучше использовать специальные программы, которые рассчитывают координаты таких областей по щелчкам мыши. Итак, для начала, нужно поместить изображение в HTML-документе обычным способом

<IMG SRC="1.gif" BORDER="0" HEIGHT="100" WIDTH="100">

Затем, добавить атрибут картирования: USMAP="#....." где: вместо точек, пишется имя карты:

<IMG SRC="1.gif" BORDER="0" HEIGHT="100" WIDTH="100" USMAP="#cartography">

Далее, пишется код самой карты изображения с координатами всех "горячих" областей. Карта определяется тэгами: <MAP NAME="...."> и </MAP>

Код координат областей имеет вид: <AREA SHAPE="RECT" COORDS=".. , .. " HREF="URL"> Код координат вписывается между тэгами карты. Форма "горячих" областей определятся содержимым атрибута SHAPE="..."

SHAPE="CIRCLE" – сферическая форма.

Примерный код:

<IMG SRC="1.gif" BORDER="0" HEIGHT="100" WIDTH="100" USMAP="#MAP1"> <MAP NAME="MAP1"> <AREA SHAPE="CIRCLE" COORDS="58,56,46" HREF="1.html"> </MAP>

SHAPE="RECT" – прямоугольная форма.

Примерный код:

<IMG SRC="1.gif" BORDER="0" HEIGHT="100" WIDTH="100" USMAP="#MAP2"> <MAP NAME="MAP2"> <AREA SHAPE="RECT" COORDS="17,13,104,95" HREF="2.html"> </MAP>

Практическая работа № 7

Наименование: Конструирование простых и сложных таблиц на web - страницах

1. Цель: Научится создавать простые, сложные таблицы

2. Литература:

2.1 Квинт И. HTML и CSS на 100%. – СПб.: Питер, 2008с.

3. Задание:

3.1 В строке заголовка должен отражаться номер практической работы

3.2 В теле документа создайте заголовок первого уровня, где укажите наименование работы. Заголовком второго уровня – цель работы.

3.3 Создайте простую таблицу следующего вида:

Товар

Код

Количество

Цена

Клей

028

190 шт

12,2 руб

Скотч

058

120 шт

4,6 руб

Ластик

986

100 шт

2,3 руб

* таблица может быть заполнена другими данными

3.4 Создайте сложную таблицу:

3.5 Создайте таблицу следующего вида: