КАТЕГОРИИ:
Архитектура-(3434)Астрономия-(809)Биология-(7483)Биотехнологии-(1457)Военное дело-(14632)Высокие технологии-(1363)География-(913)Геология-(1438)Государство-(451)Демография-(1065)Дом-(47672)Журналистика и СМИ-(912)Изобретательство-(14524)Иностранные языки-(4268)Информатика-(17799)Искусство-(1338)История-(13644)Компьютеры-(11121)Косметика-(55)Кулинария-(373)Культура-(8427)Лингвистика-(374)Литература-(1642)Маркетинг-(23702)Математика-(16968)Машиностроение-(1700)Медицина-(12668)Менеджмент-(24684)Механика-(15423)Науковедение-(506)Образование-(11852)Охрана труда-(3308)Педагогика-(5571)Полиграфия-(1312)Политика-(7869)Право-(5454)Приборостроение-(1369)Программирование-(2801)Производство-(97182)Промышленность-(8706)Психология-(18388)Религия-(3217)Связь-(10668)Сельское хозяйство-(299)Социология-(6455)Спорт-(42831)Строительство-(4793)Торговля-(5050)Транспорт-(2929)Туризм-(1568)Физика-(3942)Философия-(17015)Финансы-(26596)Химия-(22929)Экология-(12095)Экономика-(9961)Электроника-(8441)Электротехника-(4623)Энергетика-(12629)Юриспруденция-(1492)Ядерная техника-(1748)
Отделение изображения от текста
|
|
|
|
Помещение изображения в рамку.
Эта простая операция предполагает применение атрибута BORDER тэга <IMG>. По умолчанию программа просмотра использует рамку, которая указана в соответствующей ссылке.
<HTML>
<HEAD>
<TITLE>Использование атрибута BORDER</TITLE>
</HEAD>
<BODY>
<A HREF=""><IMG SRC="book.gif" BORDER=0></A>
<BR>
<A HREF=""><IMG SRC="book.gif" BORDER=5></A>
<BR>
<A HREF=""><IMG SRC="book.gif" BORDER=10></A>
</BODY>
</HTML>
Вам может не понравиться, что текст слишком близко подходит к изображению. Если это так, используйте атрибуты VSPACE и HSPACE для указания расстояния (по вертикали и горизонтали) между кромкой текста и краями иллюстрации.
Чтобы задать поля вокруг картинки, надо написать тэг вида:
<IMG SRC="logotip.jpg" ALIGN=LEFT HSPACE=20 VSPACE=10>
Здесь числа 20 и 10 определяют размеры полей.
2. Фоновая графика. Использование изображения в качестве ссылки.
Ранее мы немного затронули, каким образом в HTML-документе можно установить фоновое изображение. Остановимся теперь более подробно. Чтобы украсить страницу, можно заполнить фон картинкой из графического файла. Фоновое изображение - это графический файл, содержащий картинку (желательно небольшого размера), который многократно выводится на экран, заполняя все окно. Изображение для фона должно напоминать фрагмент обоев, т. е. быть небольшим и незамысловатым, чтобы, во-первых, не замедлять загрузку, а во-вторых, текст на выбранном фоне должен легко читаться. Это совет, а не обязательное ограничение.
Фоновая графика задается в тэге <BODY> в начале документа HTML, подобно тому, как задается цвет фона. При этом используется атрибут BACKGROUND, значением которого является имя графического файла. Например, если мы хотим для фона взять файл FON.GIF, то соответствующий тэг будет выглядеть так: <BODY BACKGROUND="fon.gif">
|
|
|
Для браузера Internet Explorer можно использовать дополнительный атрибут BGPROPERTIES=FIXED, запрещающий прокрутку фона в окне экрана. Например:
<BODY BACKGROUND="fon.gif" BGPROPERTIES=FIXED>
Следует иметь в виду, что существуют неграфические браузеры, а в графических браузерах пользователи могут отключать загрузку графики, поэтому можно задать и текстовое описание графики, встроенной в документ, т. е. описать содержание картинки или указать размер и формат графического файла. Последнее даже предпочтительнее, поскольку пользователь графического браузера сможет сам решить, стоит ли загружать тот или иной графический файл или лучше не тратить время на это. Подмена графики текстом осуществляется с помощью атрибута ALT в тэге <IMG>. Например:
<IMG SRC="vishka.gif" ALT="[нефтяная вышка, gif 43 K]">
Пример использования фоновой графики, в котором картинка заполняет все окно:
<HTML>
<HEAD><TITLE>Фоновая графика</TITLE></HEAD>
<BODY BACKGROUND="vishka.jpg" text="red">
<BR>
<BR>
<BR>
<H1>Это - текст поверх фоновой графики</H1>
<H2>Выбирайте фон так, чтобы он не мешал восприятию текстовой информации</H2>
</BODY>
</HTML>
Пример использования фоновой графики
<HTML>
<HEAD><TITLE>Фоновая графика</TITLE></HEAD>
<BODY BACKGROUND="ink.gif" text="red">
<BR>
<BR>
<BR>
<H1>Это - текст поверх фоновой графики</H1>
<H2>Выбирайте фон так, чтобы он не мешал восприятию текстовой информации</H2>
</BODY>
</HTML>
Чтобы использовать изображение в качестве ссылки на другой документ достаточно включить имя файла изображения в тэг <A>:
<A HREF=”http://www.mysite.com”><IMG SCR=”image.gif”></A>
Контрольные вопросы:
1. Назовите способы размещения графических изображений на HTML-странице.
|
|
|
2. Каким образом осуществляется выравнивание текста по краю изображения?
3. Перечислите значения атрибута ALIGN.
4. Каким образом можно указать размеры выводимого изображения?
5. Как уменьшить или увеличить масштаб изображения?
6. Как изображение в HTML-документе разместить в рамку?
7. Каким образом можно отделить изображение от текста?
8. Как в HTML-документе ведется работа с фоновым изображением?
Домашнее задание:
Оформить доклады на темы: «Характеристика графических форматов», «Список графических средств HTML»
[8], с. 135-147
|
|
|
|
|
Дата добавления: 2014-12-23; Просмотров: 497; Нарушение авторских прав?; Мы поможем в написании вашей работы!