Практическая работа №4. Тема: «вставка изображений, задание цвета страницы»

Задание 1. Вставка изображения.

1. Найдите в Интернете изображение персонального компьютера.

2. Создайте на компьютере папку, скопируйте изображение в эту папку.

3. Скопируйте в эту же папку созданную вами   Web- страницу.

4. Откройте созданную вами Web – страницу с помощью программы Bluefish

5. Установите на страницу изображение с помощью тега <IMG SRC=” “>, указав название картинки и ее расширение.

6. Установите размеры картинки с помощью атрибутов

Ø WIDTH=”…”

Ø HEIGHT=”…”

7. С помощью атрибута ALT=”…” подпишите название картинки, которое будет выводиться при наведении на нее мышью.

8. Разместите картинку по правому краю, добавив в конструктор тегов изображения атрибут ALIGN=”right”

<IMG SRC=” “ HEIGHT=”…” ALT=”…” ALIGN=”right”>

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

 

Задание 2. Задание цвета фона Web – страницы

1. Внутри тега BODY введите атрибут BGCOLOR=”…”  и выберите подходящий цвет для вашей страницы.

цвет код название цвет код название
черный #000000 black фиолетовый #FF00FF magenta
белый #FFFFFF white бирюзовый #00FFFF cyan
красный #FF0000 red желтый #FFFF00 yellow
зеленый #00FF00 lime золотой #FFD800 gold
синий #0000FF blue оранжевый #FFA500 orange
серый #808080 gray коричневый #A82828 brown

Задание 3. Создание еще 2 тематических Web – страниц

На основании изученного материала создайте еще 2 тематические страницы для вашего сайта. На одной из них разместите информацию про устройства ввода, а на второй - про устройства вывода. Назовите каждую из них 2.htm и 3.htm соответственно. Сохраните эти страницы в папке сайте (там, где вы сохраняли свою первую Web-сраницу).

 

ПРАКТИЧЕСКАЯ РАБОТА №5. Тема: «Создание гиперссылок на Web – странице».

Задание 1. Создать гиперссылку, позволяющую перейти на 2 и 3 страницу  Web – сайта.

6. Откройте файл index.htm с помощью программы Bluefish

7. Продолжите фразу Мы познакомим вас со всеми основными устройствами компьютера: словами устройствами ввода и устройствами вывода

8. Расположите словосочетания устройствами ввода и устройствами вывода друг под другом

9. Сохраните изменения и посмотрите в браузере.

10. Создайте гиперссылку со словосочетания устройствами ввода на страницу 2.htm и гиперссылку со словосочетания устройствами вывода на страницу 3.htm

Для этого:

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

  <A HREF="2.htm"> устройствами ввода </A>

 <A HREF="3.htm"> устройствами вывода </A>

 

11. Сохраните изменения и проверьте работу гиперссылок в браузере.

 

Задание 2. Создать гиперссылки, позволяющие возвращаться на титульную страницу Web – сайта.

1. Откройте файл 2.htm с помощью программы Bluefish

2. Введите внизу страницы текст НАЗАД

3. Создайте гиперссылку, которая при нажатии на слово НАЗАД будет возвращать вас на титульную страницу.

4. Аналогично создайте гиперссылку в файле 3.htm, возвращающую на титульную страницу.

5. Сохраните изменения и проверьте работу гиперссылок в браузере.

 

Задание 3. Создать гиперссылку на картинку.

1. Найдите в Интернете картинки различных устройств ввода и вывода, которые не использовались в вашем сайте и скопируйте их в свою папку.

2. Создайте гиперссылки с названий устройств ввода и вывода на соответствующие картинки в вашей папке с помощью тега <A HREF="название картинки с расширением"> название устройства </A>

 


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: