
- •Введение
- •От автора
- •С труктура html документов
- •Анатомия web страницы
- •Указание приложения, в котором был создан документ
- •Оформление основной части страницы
- •Форматирование текста
- •Теги управления шрифтом
- •Специальные символы
- •Задание произвольного вида маркеров в списке
- •Работа с графикой, звуком и видео клипами
- •Гиперссылки
- •Изображения-карты
- •Создание стилей
- •Сценарии
- •Редакторы гипертекста
- •Форматы графических файлов
- •Лабораторная работа №1 Тема. Оформление страницы
- •Лабораторная работа №2 Тема. Стилевое оформление текста
- •Лабораторная работа №3 Тема. Таблицы
- •Лабораторная работа №4 Тема. Списки
- •Лабораторная работа №5 Тема. Работа с графикой, звуком и видеоклипами
- •Лабораторная работа №6 Тема. Ссылки
- •Приложение а. Цветовая модель rgb
- •Приложение b. Свойства таблиц стилей
Лабораторная работа №3 Тема. Таблицы
Цель. Научиться представлять информацию в таблице.
Задания
Запустите текстовый редактор Блокнот. Создайте HTML файл, содержащий в заголовке окна наименование темы лабораторной работы. Задайте файлу имя 3.htm
Создайте простую таблицу. Содержащею три столбца и три строки.
Используя атрибут background, в теге <TABLE>, задайте в качестве фона таблицы рисунок.
Измените цвет первой строки на серый.
Объедините две ячейки в нижней строке.
Объедините две ячейки в первом столбце.
Измените толщину и цвет рамки в таблице.
Измените размер и цвет шрифта в одной из ячеек. Для изменения шрифта можете использовать любой способ, применяемый Вами в работе №2.
Создайте еще одну таблицу. Содержащею два столбца и три строки.
Уберите бордюр внешней рамки.
Задайте заголовок таблицы, используя тег <CAPTION>.
Задайте цвет заголовка таблицы.
Задайте цвет внутренней рамки.
Используя, тег <COLGROUP> измените внешний вид всех ячеек правого столбца.
Контрольные вопросы
В каком теге и какой атрибут задает цвет фона всей таблицы?
Что задает атрибут cellpadding?
В каком теге применяется и что задает атрибут frame?
Для каких целей используются теги <TR>, <TH>, <TD>?
Как осуществить объединение строк? Объединение - столбцов?
Где выводиться содержимое тега <CAPTION>? Где размещается тег <CAPTION>?
Как задать цвет отдельной ячейки в таблице?
Как можно использовать стили применительно к таблице?
Лабораторная работа №4 Тема. Списки
Цель. Приобрести навыки работы со списками.
Задания
Запустите текстовый редактор Блокнот. Создайте HTML файл, содержащий в заголовке окна наименование темы лабораторной работы. Задайте файлу имя 4.htm
Создайте не нумерованный список из трех пунктов.
Создайте нумерованный список из трех пунктов. Нумерация, арабскими числами начиная с единицы.
Создайте нумерованный список из трех пунктов. Нумерация, римскими числами начиная с Ш.
Создайте нумерованный список из трех пунктов. Нумерация, буквенная начиная с буквы «С».
Создайте не нумерованный список их трех пунктов. Каждый, не нумерованный пункт, содержит нумерованный буквами (начиная с буквы «А») список из двух пунктов.
Создайте не нумерованный список с маркерами в виде кружков.
Измените цвет маркеров.
Измените вид маркеров на квадраты.
Создайте не нумерованный список с маркерами в виде рисунка.
Создайте список без маркеров, используя атрибут List-style-type = none.
Контрольные вопросы
Как увеличить размер (шрифт) маркеров?
Как задать начальное значение для нумерации списка?
Как задать цвет текста для списка?
Какова структура не нумерованного списка?
Как изменить внешний вид маркера?
Какова структура вложенного списка?
Как расположить два списка рядом друг с другом, один список в левой части страницы, другой в правой?
Как создать стиль для нумерованного списка?
Лабораторная работа №5 Тема. Работа с графикой, звуком и видеоклипами
Цель. Приобрести навыки вставки на страницу рисунков, звуковых файлов и видеофайлов.
Задания
Запустите текстовый редактор Блокнот. Создайте HTML файл, содержащий в заголовке окна наименование темы лабораторной работы. Задайте файлу имя 5.htm
Используя тег <IMG> отобразите на странице рисунок. Задайте размер выводимого рисунка 200300 пикселей.
Поместите текст рядом с рисунком, используя таблицу.
Используя таблицу, поместите рядом с первым рисунком еще один рисунок.
Создайте бегущую строку: задов цвет фона – голубой; цвет текста – темно синий; размер букв – 10 пикселей; направление движения – с лева на право; число проходов по экрану – 5.
Создайте картинку, которая сопровождалась звуком. Для озвучивания картинки используйте структуру:
<IMG SRC=”Путь и имя рисунка” DYNSRC=”Путь и имя звукового файла”>
Создайте рисунок на месте, которого демонстрировался клип. Используйте следующую структуру для вывода на экран картинки, а после загрузки всей страницы на месте картинки будет воспроизведен видеофайл:
<IMG SRC=”Путь и имя рисунка” DYNSRC=”Путь и имя звукового файла”>
Используя тег <EMBED> загрузим на страницу видеоклип, указав размеры экрана отведенного под воспроизведения клипа:
<EMBED SRC=”Путь и имя файла с клипом” height=240 width=300>
Задайте атрибут AVTOSTART=YES тега <EMBED>. Обновите страницу. Что изменилось?
Используя тег <EMBED> воспроизведите звуковой файл. Используйте структуру:
<EMBED SRC=” Путь и имя звукового файла ” >
Используя тег <BGSOUND> воспроизведите звуковой файл. Используйте структуру:
<BGSOUND SRC=” Путь и имя звукового файла ” >
Контрольные вопросы
Как задать размеры отображаемого рисунка?
Какой графический формат поддерживает большинство браузеров?
На что влияет размер выводимых на странице рисунков?
Почему рекомендуется задавать размер рисунков на странице?
Для каких целей используется атрибут ALT в теге <IMG>?
В чем отличие использования различных тегов при воспроизведении звуковых файлов?
Как запретить (разрешить) пользователю управлять воспроизведением клипа или звука?
Какое программное и аппаратное обеспечение должно быть установлено на компьютере для возможности просматривать и прослушивать вашу мультимедийную страницу?