14115

ВСТАВКА ГРАФИЧЕСКОГО ИЗОБРАЖЕНИЯ

Конспект урока

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

УРОК 6 ВСТАВКА ГРАФИЧЕСКОГО ИЗОБРАЖЕНИЯ Наличие изображений делает Webстраницу более привлекательной и информативной для посетителей. Сами рисунки хранятся в отдельных файлах вне документа HTML но отображаются браузером внутри Webстраницы. Для вставки рисунка нужн

Русский

2013-05-21

383.5 KB

2 чел.

УРОК 6

ВСТАВКА ГРАФИЧЕСКОГО ИЗОБРАЖЕНИЯ

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

Для вставки рисунка нужно воспользоваться тегом <IMG>.

Атрибут src

Обязательным атрибутом этой команды является атрибут src, с его помощью задается имя файла, в котором хранится рисунок. Обычно графические файлы помещают в отдельный каталог pic (или image), который является подкаталогом для каталога с HTML-текстами.

Пример команды вывода графики: <IMG src=pic/picture.jpg>

Вставляемые изображения должны быть представлены в виде файлов формата GIF или JPEG (более подробно графические форматы будут рассмотрены на следующем уроке).

Другие атрибуты тега <IMG>

Атрибуты

Описание

alt

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

Пример записи: <IMG src=logo.gif alt="Логотип">

width, height

Ширина и высота картинки (в пикселях).

Например: <IMG src=logo.gif width=300 height=150>

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

border

Рамка вокруг картинки. Значением атрибута является толщина рамки (в пикселях).

Например: <IMG src=logo.gif border=1>

Чтобы удалить рамку, нужно задать нулевое значение атрибута.

align

Задает правила размещения на Web-странице текста и графических изображений относительно друг друга. Значения top, bottom и middle задают вертикальное положение фрагмента текста относительно картинки.

Пример1<IMG src="images\analisator.gif" alt="Анализатор" width="150" height="138" border="1" align="top">

Значения left и right задают способ обтекания графики текстом.

Пример2

hspace, vspace

Задает ширину пустой области (в пикселях) вокруг изображения, отделяющей его от остальных элементов страницы (hspace  слева и справа, vspace  сверху и снизу). Это позволит избавиться от эффекта прилипания текста к картинке.

Пример3


Вставка картинки средствами редактора HomeSite

  1.  На панели инструментов Common нажмите кнопку (Image).
  1.  В появившемся диалоговом окне ввести значения полей:
  •  Sourse адрес картинки (можно воспользоваться кнопкой (Обзор));
  •  Alt.Text альтернативный текст;
  •  Width, Heigt ширина и высота картинки (автоматически вставляются реальные размеры выбранного изображения);
  •  Hspace, Vspace ширина пустой каймы вокруг картинки;
  •  Border ширина рамки;
  •  Align выравнивание;
  1.  Нажать кнопку ОК

В результате выполненных действий в тексте программы появится строка HTML-кода:

<IMG src="pic\11.jpg" alt="Закат" width="200" height="133" hspace="8" vspace="5" border="1" align="left">.

Картинки ссылки

Если команду IMG вложить внутрь дискриптора <A>…</A>, то она будет работать как ссылка. При этом изображение обрамляется рамкой того же цвета, что объявлен для ссылок. Если рамка нежелательна, неоходимо указать нулевое значение атрибута border.


Задание

Небольшие графические изображения могут играть роль маркеров списка. При этом элементы маркированного списка не объявляются тегом <LI>. Каждый элемент начинается переходом на новую строку и картинкой. Рекомендуется использовать для картинок-маркеров атрибуты align и hspase. Атрибут align позволит выровнять строку текста относительно маркера, а hspace поможет задать одинаковые отступы текста от маркера.

Создайте документ по образцу:

Примечания:

  1.  Фон документа находится в файле 06_fon.jpg.
  2.  Цвет линии имеет код #660033
  3.  Заголовок страницы объявлен заголовком второго уровня, размер последнего слова увеличен.
  4.  Используются вложенные списки. Каждый уровень вложенности отличается отступом текста вправо.
  5.  Картинки для маркеров лежат в папке images/

06_sm1.gif

06_sm2.gif

06_sm3.gif

06_sm4.gif

06_sm5.gif

06_sm6.gif

PAGE  2


 

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

74827. Оригинальные памятники древнерусской литературы – летописи, торжественные проповеди, поучения, жития, паломническая литература как свидетельство высокого уровня государственной и культурной жизни Руси XI – XII веков 17.17 KB
  Большинство дошедших до нас книг относящихся к этому периоду времени религиозного содержания.К этому же периоду времени относятся такие выдающиеся памятники церковной литературы как Слово о законе и благодати митрополита Илариона проповеди Кирилла Туровского. К этому периоду времени относится древнейший сохранившийся до наших дней летописный свод Повесть временных лет . Этот документ позволяет нам судить не только о политической ситуации того времени но и о быте нравах древних русичей.
74828. Повесть временных лет как литературный памятник: содержание, художественные особенности, связь с фольклором 21.34 KB
  Основные идеи начальной летописи. Уже в самом названии Се повести времянъных лет откуду есть пошла Руская земля кто в Киеве нача первее княжити и откуду Руская земля стала есть содержится указание на идейнотематическое содержание летописи. стоят в центре внимания летописи. Тема родины является определяющей ведущей в летописи.
74829. Слово о законе и благодати митрополита Илариона. Поэтическая образность Слова о законе и благодати 17.53 KB
  Слово о законе и благодати проникнуто патриотическим пафосом прославления Руси как равноправной среди всех государств мира. Византийской теории вселенской империи и церкви Иларион противопоставляет идею равноправия всех христианских народов. Сопостав-ляя иудаизм (Закон) с христианством (Благодатью)
74830. Житийная литература. «Житие Феодосия Печерского», написанное Нестором 15.95 KB
  Житие Феодосия Печерского написанное Нестором. Житие Феодосия Печерского памятник древнерусской литературы написанный преподобным Нестором Летописцем.: Житие Феодосия Печерского типичное монашеское житие рассказ о благочестивом кротком трудолюбивом праведнике вся жизнь которого непрерывный подвиг. Написанное им Житие имеет динамичный сюжет и лишено традиционных для данного жанра риторических рассуждений.
74831. Хождение как литературный жанр. Хождение игумена Даниила в святую землю 15.45 KB
  Хождение игумена Даниила в святую землю Хождение – это жанр средневековой русской литературы форма путевых записок в которых русские путешественники описывали свои впечатления от посещения иностранных земель...
74832. Поэтическая образность «Слова о полку Игореве». Композиция «Слова о полку Игореве», лирические и публицистические отступления 19.8 KB
  В нем автор размышляет о художественных принципах наложения материала и как бы ведет диалог с читателем. Далее автор переходит к повествованию о событиях похода. Автор дает краткий эмоционально приподнятый рассказ о первом столкновении русских с половцами и о богатых трофеях взятых русскими. В описании битвы автор сосредоточивает внимание на героической фигуре буйтура Всеволода и ограничивается упоминанием об Игоре который пытается вернуть на поле боя бегущих ковуев.
74833. Моление Даниила Заточника: своеобразие памятника, его обличительный пафос, антибоярская и антиклерикальная направленность 16.22 KB
  Моление Даниила Заточника адресовано князю Ярославу Всеволодовичу Переяславскому княжившему с 1213 по 1236 г. Сам же Даниил выступает сторонником сохранения холопства. Бояр Даниил относит к злым господам которые попирают человеческое достоинство своих слуг.
74834. Повести о татарском нашествии. «Повесть о битве на реке Калке» (1223 г.), «Повесть о приходе Батыя на Рязань» (1237 г.) – воинские повести 20.59 KB
  Повесть о битве на реке Калке. Первое столкновение русских войск с кочевниками произошло в 1223 г. на реке Калке (Кальмиус). Летописная повесть об этой битве дошла до нас в двух редакциях. Повесть обстоятельно излагает ход событий. Весть о появлении языка незнаемого (неизвестного народа) принесли в Киев половцы, с которыми первыми столкнулись отряды степных кочевников, шедшие с Кавказа под руководством нойонов (воевод) Чингиза Джебе и Сабутэ
74835. Слово о погибели Русской земли. Гражданский патриотический пафос памятника. Народно-поэтическая стилистика 16.22 KB
  Событиями монголотатарского нашествия очевидно порождено и такое выдающееся поэтическое произведение как Слово о погибели Русской земли впервые обнаруженное только в конце 70х годов прошлого века К. Слово о погибели Русской земли исполнено высокого гражданского патриотического звучания. В центре образ Русской земли светлосветлой и украсноукрашеной.