Главная | Обратная связь | Поможем написать вашу работу!

Порядок выполнения задания №4

Практическое задание № 41

Тема: Цветовая схема Web-страницы, вставка изображений

Цель: изучение информационной технологии задания цвета Web-странице и вставки изображений.

Оборудование и материалы: компьютер, программа Блокнот, браузер Internet Explorer, практическое задание.

Теоретические сведения к практическому заданию

Web-сайты обычно являются мультимедийными и интерактивными, т.е. содержат изображения и гиперссылки. При вставки изображений, гиперссылок и т.д. используются тэги с атрибутами.

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

Цвет на Web-странице задают либо его названием, либо числовым шести разрядным шестнадцатеричным кодом #RRGGBB (первые два разряда задают интенсивность красного цвета, вторые – зеленого и третьи – синего).

Значение яркости цвета может меняться от минимальной 00 до максимальной FF. В таблице приведены примеры некоторых цветов:

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

Основную цветовую схему Web-страницы можно задать в тэге <BODY> с помощью атрибутов:

Цвет фона	BGCOLOR="#RRGGBB"
Текстура фона	BACKGROUND="file_name"
Цвет текста	TEXT="#RRGGBB"
Цвет текста ссылки	LINK="#RRGGBB"
Цвет текста активной ссылки	ALINK="#RRGGBB"
Цвет текста просмотренной ссылки	VLINK="#RRGGBB"

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

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

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

Изображения помещаются на Web-страницу тэгом IMG с атрибутом SRC, сообщающим браузеру имя и местоположение графического файла.

Если рядом с изображением не должно быть текста, его размещают внутри отдельного абзаца. Выравнивание рисунка по горизонтали в этом случае задают в тэге . Размеры изображения (в пикселах) можно задать с помощью атрибутов WIDTH и HEIGHT.К изображению атрибутом ALT можно добавить название, которое появляется на экран или вместо иллюстрации (если по какой - либо причине графика не выводится в окне браузера), или в качестве всплывающий строки, при указании на рисунок мышью.

Атрибут ALIGN выравнивает текст по верхнему краю, середине или нижнему краю изображения, справа или слева от него с помощью значений: top, bottom, middle, left или right.

Содержание задания

Задание 1

Задайте цвет Web-странице.

Порядок выполнения задания №1

1. Запустите браузер Internet Explorer (Пуск →Все программы →Internet Explorer) и откройте файл index.htm [Файл - Открыть].

2. Активизируйте Блокнот с открытой в нем редактируемой Web-страницей [Вид – Просмотр HTMLкода].

3. Для оформления страницы о Московском Кремле в контейнер <BODY></BODY> введите:

4. Сохраните новый вариант страницы, выполнив команду меню [Файл - Сохранить].

5. Активизируйте браузер с открытым в нем предыдущим вариантом страницы. Щелкните по кнопке Обновить. В окне браузера отобразится обновленная Wed-страница

Задание 2

Вставьте в начале Web страницы картину М.Н.Воробьева «Вид Московского Кремля. 1818»

Порядок выполнения задания №2

1. Активизируйте Блокнот с открытой в нем редактируемой Web-страницей [Вид – Просмотр HTMLкода].

2. Для вставки в начале страницы картины М.Н.Воробьева «Вид Московского Кремля. 1818» в контейнер <BODY></BODY> введите:

3. Сохраните новый вариант страницы, выполнив команду меню [Файл - Сохранить].

4. Активизируйте браузер с открытым в нем предыдущим вариантом страницы. Щелкните по кнопке Обновить. В окне браузера отобразится обновленная Wed-страница

Задание 3

Поместите изображение Царской башни определенного размера слева от текста.

Порядок выполнения задания №3

1. Активизируйте Блокнот с открытой в нем редактируемой Web-страницей [Вид – Просмотр HTMLкода].

2. В контейнер <BODY></BODY> введите:

3. Сохраните новый вариант страницы, выполнив команду меню [Файл - Сохранить].

Задание 4

Выделите часть текста цветом.

Порядок выполнения задания №4

1. Активизируйте Блокнот с открытой в нем редактируемой Web-страницей [Вид – Просмотр HTML кода].

2. В контейнер <BODY></BODY> перед текстом «Несколько раз Московскому Кремлю грозило уничтожение» введите:

3. После предложения «Однако судьба сохранила Кремль, и в наше время он стал символом Российской государственности.» введите .

10. Сохраните новый вариант страницы, выполнив команду меню [Файл - Сохранить].

11. Активизируйте браузер с открытым в нем предыдущим вариантом страницы. Щелкните по кнопке Обновить. В окне браузера отобразится обновленная Wed-страница

12. Закройте браузер.

Задание №5

Ответьте на контрольные вопросы к практическому заданию.

Задание №6

1. Сделайте вывод о проделанном практическом задании.

2. Сдайте отчет преподавателю.

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

1. Как задают цвет на Web – странице?

2. Как может меняться значение яркости цвета?

3. Почему для фона Web – страницы указывают цвет, совпадающий с основным тоном фонового рисунка.

4. Графические файлы, каких форматов используют для размещения на Web – страницах?

5. Каким тегом, и с каким атрибутом помещаются изображения на Web – страницу?

Воспользуйтесь поиском по сайту: