42554

Создание фоновых рисунков, графических изображений, gif-анимаций, звуковых (mid или wav) файлов видеоклипов (avi или mpg), бегущих строк

Лабораторная работа

Информатика, кибернетика и программирование

Вставка рисунка в документ: img src= my. Если рисунок находится в поддиректории то ссылка на него будет выглядеть так: img src= my my.jpg Если рисунок лежит на уровень выше а документ находится в поддиректории то ссылка на неё будет такой: img src= .jpg Если картинка лежит на другом сайте то путь прописывается полностью: img src= http: www.

Русский

2013-10-30

29.5 KB

1 чел.

Лабораторная работа № 2

Вставьте в Web-страницу фоновый рисунок, графическое изображение,  gif-анимацию, звуковой (mid или wav) файл, видеоклип (avi или mpg), бегущую строку и просмотрите в Web-броузере.

 Цель: Приобретение практических навыков создания фоновых рисунков, графических изображений,  gif-анимаций, звуковых (mid или wav) файлов видеоклипов (avi или mpg), бегущих строк.

Задачи лабораторной работы:

  1.  Откройте файл с лабораторная работа № 1.


D:\users\ek-01-1\fio\1.html

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

<img src="my.jpg">

Вместо my.jpg мы можем подставить имя любого рисунка (me.gif, main.png). Рисунок должен находится в том же каталоге (директории, папке), в которой находится и файл
1.html. Если рисунок находится в поддиректории то ссылка на него будет выглядеть так:

<img src="my/my.jpg">

Если рисунок лежит на уровень выше, а документ находится в поддиректории, то ссылка на неё будет такой:

<img src="../my.jpg">

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

<img src="http://www.homepage.ru/my/my.jpg"> 

Вставьте строку:

<img src="primtocodephoto.gif">

Перед строкой:

<p align="right">Выполнил:  Ст.гр. ЕК-01-1

3. У некоторых тэгов есть параметры (атрибуты), параметр может задаваться один, а может их быть несколько. Например у тэга <p> - <p align="justify">. Параметр align есть и у картинок:

<img src="pr1.png" align="left">

Это означает, что картинка будет прижата к левому краю экрана, а текст будет обтекать ее справа. Чтобы сделать наоборот (картинка справа, текст слева) надо прописать right:

<img src="pr1.png" align="right">

Но это не все: текст может располагаться внизу картинки (это по умолчанию) - (1), посередине - (2), и вверху - (3):

(1) - <img src="pr1.png" align="bottom">
(2) - <img src="pr1.png" align="middle">
(3) - <img src="pr1.png" align="top">

Кроме параметра align существует еще несколько параметров:

(1) - <img src="pr1.png" Vspace="10">
(2) - <img src="pr1.png" Hspace="30">
(3) - <img src="pr1.png" alt="моя фотография">
(4) - <img src="pr1.png" width="100">
(5) - <img src="pr1.png" height="200">
(6) - <img src="pr1.png" border="5">

Где:
(1) - параметр vspace - задает расстояние между текстом и рисунком (по вертикали). Расстояние задается в пикселях (pixel - минимальная единица изображения, точка. Например разрешение экрана 800х600 - 800 на 600 точек). В нашем примере расстояние равно 10 пикселям.

(2) - параметр hspace - тоже задает расстояние между текстом и рисунком, но по горизонтали. Расстояние задается в пикселях. В нашем примере оно равно 30 пикселям (точкам).

(3) - параметр alt - краткое описание картинки. Если навести курсором мыши на рисунок, и так подержать его (курсор) несколько секунд выскочит описание картинки. В нашем случае это будет фраза - "моя фотография". Если параметр alt не задавать, описания не будет. Но умные люди говорят, что описание картинкам задавать следует (особенно, если это кнопки), т.к. есть особенные люди, которые бродят по интернату с отключенной графикой. Без alt им не будет видно на что жать, т.к. картинка не отображается, а при заданном alt, можно увидеть надпись, для чего она (картинка) предназначалась.

(4) - параметр width - ширина самой картинки (в пикселях). Если ширину не задавать специально, то по умолчанию она будет равна реальной ширине картинки (а так вы можете ее сделать или уже или шире).

(5) - параметр height - высота самой картинки (тоже в пикселях). Так же как в случае с width высоту (height) картинки можно и не задавать.
(6) - параметр border - рамка вокруг самой картинки (в пикселях). Можно не задавать.

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

<img src="pr1.png" align="left" HSPACE=30 VSPACE=5 alt="моя фотография">

Наша картинка будет прижата к левому краю экрана, текст будет обтекать ее справа, расстояние до текста по горизонтали - 30 пикселей, по вертикали - 5 пикселей (чтобы красиво все смотрелось), ну, и если вы наведете на картинку курсор, то выскочит надпись - "моя фотография".

Вставте строку:
<img src="pr1.png" align="left" HSPACE=30 VSPACE=5 alt="моя фотография">

Перед строкой:

<p align="right">Выполнил:  Ст.гр. ЕК-01-1

Сохраним  документ и откроем IE

4.  Ответить на контрольные вопросы по лабораторной работе.

Контрольные вопросы по лабораторной работе № 2

1. Что такое Web-страница и какие существуют способы ее создания?

2. Какова общая структура документа HTML?

3. Какие теги форматирования текстового потока и абзацев Вы знаете?

4. Как задать цвет текста, цвет фона, цвет гиперссылки?

5. Как вставить в документ HTML графическое изображение?

6. Как вставить в документ HTML фоновый рисунок?

7. Как вставить в документ HTML бегущую строку? Как изменить их цвет и размеры?


 

А также другие работы, которые могут Вас заинтересовать

15924. Практикум по криминалистике 4 MB
  Практикум по криминалистике Учебное пособие Под редакцией проф. Н. П. Яблокова Рекомендовано Московским государственным университетом им. М. В. Ломоносова Издательство БЕК Москва. 1995 ББК 67.99294 К 82 Коллектив авторов: В. Я. Колдин В.В. Крылов М....
15925. Криминалистика. Учебник 3.29 MB
  КРИМИНАЛИСТИКА Издание второе переработанное и дополненное Учебник отражает современное состояние криминалистики как науки учебной дисциплины криминалистической практики и последние достижения в этих областях. Его авторы в основном придерживаясь традиционно
15926. Издательский договор 572 KB
  Юрченко А. К. Издательский договор. Л.: Издательство Ленинградского университета. –1988. 104 с. В монографии освещаются следующие вопросы: понятие издательского договора его виды порядок заключения договора его элементы договаривающиеся стороны предмет договора фор...
15927. Міжнародне приватне право 1.96 MB
  Матеріали цього підручника сприятимуть набуттю знань і вмінь, необхідних для підготовки фахівців (спеціалістів і магістрів) правознавства високого рівня, здатних вирішувати інте-граційні проблеми сьогодення. Саме такі завдання сформульовані в межах державної освітянської політики в нашій країні. Так, у Рішенні Державної ради з питань європейської та євроатлантичної інтеграції України
15928. Конституция правовое государство конституционный суд 1.43 MB
  Б.С. ЭБЗЕЕВ КОНСТИТУЦИЯ ПРАВОВОЕ ГОСУДАРСТВО КОНСТИТУЦИОННЫЙ СУД Москва Закон и право Издательское объединение ЮНИТИ 1996 ББК 67.400я73 Э13 Рецензенты: др юрид. наук проф. В.Г. Стрекозов Судья Конституционного Суда РФ; др юрид. наук проф. М.А. Шафир помощн
15929. Менеджмент. Общая теория управления 578 KB
  Конечная цель менеджмента состоит в обеспечении прибыльности, или доходности, а деятельности фирмы путем рациональной организации производственного процесса, включая управление производством и развитие технико-технологической базы, а также эффективное использование кадрового потенциала при одновременном повышении квалификации, творческой активности и лояльности каждого работника.
15930. Деятельное раскаяние в совершенном преступлении 604.5 KB
  Щерба C. Савкин А.В. Деятельное раскаяние в совершенном преступлении. К. 1997. 110 с ПРЕДИСЛОВИЕ На протяжении веков отечественный и зарубежный опыт уголовной юстиции неоднократно убеждал что одними лишь мерами ужесточения наказания невозможно добиться снижения чи...
15931. Теория социального управления 1.4 MB
  Щёкин Г.В. Теория социального управления: Монография. К.: МАУП 1996. 408 с. ISBN 5869260868. Предпринята попытка комплексного освещения проблем управления в русле социальных наук и культурноисторического подхода. Рассмотрены основные социальные законы и закономерности социал...
15932. Основы общей теории предупреждения преступности 332.5 KB
  Щедрин Н.В. Основы общей теории предупреждения преступности: Учебное пособие. Красноярск 1999. МИНИСТЕРСТВО ОБЩЕГО И ПРОФЕССИОНАЛЬНОГО ОБРАЗОВАНИЯ РОССИЙСКОЙ ФЕДЕРАЦИ КРАСНОЯРСКИЙ ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ Н. В. ЩЕДРИН ОСНОВЫ ОБЩЕЙ ТЕОРИИ ПРЕДУПРЕЖДЕНИЯ ПРЕС...