- •Лабораторный практикум
- •Лабораторная работа №1 Основы разметки гипертекста html
- •Введение
- •Заголовки
- •Оформление текста
- •Создание списков
- •Гиперссылки
- •Изображения в html-документе
- •Задание 1.
- •Задание2.
- •Задание 3
- •Лабораторная работа №2 Создание таблиц в html-документах
- •Создание таблицы
- •Задание
- •Контрольные вопросы.
- •Лабораторная работа №3 Каскадные таблицы стилей
- •Введение
- •Внутренние таблицы стилей.
- •Встроенные таблицы стилей.
- •Структура правила.
- •Селекторы классов.
- •Универсальные селекторы.
- •Комментарии css.
- •Объединение css и html.
- •Элемент style.
- •Директива @import.
- •Задание 1.
- •Задание 2.
- •Задание 3.
- •Стандартные имена для фреймов
- •Специальные эффекты, получаемые с помощью атрибута target
- •Задание
- •Контрольные вопросы
- •Лабораторная работа №5 Формы
- •Введение
- •Элементы ввода данных
- •Многострочный текст, атрибуты текстовых элементов
- •Альтернативная кнопка, перегрузка атрибутов формы
- •Выбор из списка
- •Генерирование открытого и секретного ключей
- •Другие элементы форм
- •Атрибуты элементов ввода
- •Задание.
- •Контрольные вопросы.
- •Лабораторная работа №6 Объектно Ориентированное Программирование в JavaScript.
- •Основные понятия:
- •Объект.Метод("параметры метода")
- •Значение по умолчанию
- •Применяется к тегам
- •Событие onchange
- •Событие onclick
- •Событие ondblclick
- •Задание №1
- •Размещение JavaScript на html-странице
- •Типы данных
- •Объявления переменных
- •Переменные
- •Типы переменных
- •Массивы
- •Объекты JavaScript
- •Объект Array
- •Оператор цикла
- •Условные операторы
- •Объектная модель JavaScript
- •Объекты и Свойства
- •Функции и Методы
- •Определение Методов
- •Создание Новых Объектов
- •Использование this для Ссылок Объекта
- •Объектная модель браузера
- •Объект window
- •Лабораторная работа № 8 Изучение языка php
- •Общие правила построения php-программы
- •Задание
- •1. Вывод на экран и переменные в рнр.
- •2. Передача параметров по ссылке, передача параметров из формы (get и post -- запросы).
- •3. Динамическое формирование страницы.
- •4. Работа с файлами.
- •Лабораторная работа № 10 Работа вебсайта
- •Как еще можно прописать сайт в Денвере?
- •Лабораторная работа № 11 Файловый ввод/вывод
- •1) Классическая модель веб-приложения
- •2) Модель ajax
- •Лабораторная работа №12 Внедрение рисунков
- •1. Основные положения
- •Рисование прямоугольников
- •Рисование составных фигур Составные фигуры состоят из нескольких соединенных простых объектов (таких как линии, круги и т.Д.)
- •Структура программы выглядит следующим образом
- •С помощью свойства lineCap можно оформлять кончики линии
- •Можно создавать более сложные градиенты, которые изменяют цвет в нескольких точках.
- •Папоротник
- •Гипно-спираль
- •Вставка изображений
- •4. Вложение изображения с помощью data: url
- •Рисование изображений
- •Пример 1 использования изображения
- •Масштабирование
- •Пример 2 использования изображения
- •Разрезание изображений
- •Пример 3 использования изображения
- •Пример галереи
- •Javascript графика: Объект Image.
- •Javascript графика: src и lowsrc.
- •Изменение картинки.
- •Мультипликация в JavaScript. Мультипликация.
- •Запуск мультипликации
- •Запуск и остановка мультипликации
Стандартные имена для фреймов
Определено четыре зарезервированных имени, при задании которых выполняются специальные действия. Эти имена начинаются с символа подчеркивания ("_"). Любое другое имя, начинающееся с символа подчеркивания недопустимо.
target="_blank" документ загружается в новое окно;
target="_self" документ загружается в текущий фрейм или окно;
target="_top" документ загружается в полное окно;
target="_parent" документ загружается в область, занимаемую фреймом-родителем. При отсутствии фрейма-родителя действует как "_top".
Пример
<FRAMESET COLS="25٪,75٪" FRAMEBORDER="yes" BORDER="5" BORDERCOLOR="#008800">
<FRAME src="left.htm" MARGINWIDTH="20" MARGINHEIGHT="20">
<FRAME src="right.htm" NAME="main_window" MARGINWIDTH="0" SCROLLING="no" NORESIZE> </FRAMESET>
Использование тега A для загрузки во фрейм
С помощью тега гиперссылки <A> можно загрузить документ в определенный фрейм.
Атрибуты
HREF. Определяет URL или имя нового документа, который вы хотите загрузить в определенное окно фрейма. URL – Единый указатель ресурсов (англ. URL — Uniform Resource Locator) - единообразный локатор (определитель местонахождения) ресурса
TARGET. Определяет имя фрейма, в который будет загружен новый документ. Это имя должно быть присвоено фрейму атрибутом NAME в теге <FRAME>.
В следующем примере экран разбивается на две вертикальные области. В меньшей левой части находится оглавление, а в правую будут загружаться все остальные HTML-документы. В файле оглавления находятся простые текстовые гиперссылки на соответствующие разделы. Чтобы все работало, необходимо создать HTML-документы в файлах food.htm, dress.htm, shoes.htm, clothing_repair.htm и cleaner.htm.
Пример
<!-- Файл фреймовой структуры frame.htm -->
<HTML>
<FRAMESET COLS="25٪,75٪" FRAMEBORDER="yes"
BORDER="5" >
<FRAME src="left.htm" NAME="toc_window">
<FRAME src="right.htm" NAME="main_window">
</FRAMESET>
</HTML>
<!-- Файл оглавления left.htm -->
<HTML>
<H3>Оглавление</H3>
<UL>
<LI>Товары
<UL>
<LI><A href="food.htm"
TARGET="main_window">Продукты питания</A>
<LI><A href="dress.htm"
TARGET="main_window">Одежда</A>
<LI><A href=" shoes.htm"
TARGET="main_window">Обувь</A>
</UL>
<LI>Услуги
<UL>
<LI><A href="clothing_repair.htm "
TARGET="main_window">Ремонт одежды</A>
<LI><A href=" cleaner.htm "
TARGET="main_window">Химчистка</A>
</UL>
</UL>
</BODY>
</HTML>
<!-- Файл заставки основного окна right.htm -->
<HTML>
<BODY>
<H1>Здравствуйте!</H1>
</BODY>
</HTML>
Тег <BASE>
Тег <BASE> избавит вас от необходимости повторять атрибут TARGET в каждой отдельной гиперссылки, если все они указывают на одно и то же окно фрейма. Для этого надо поместить тег <BASE> с атрибутом TARGET в контейнер <HEAD>…</HEAD>.
Использование тега <BASE> даст возможность уменьшить размер файла оглавления left.htm предыдущего примера.
Пример
<!-- Файл оглавления left.htm -->
<HTML>
<HEAD>
<BASE TARGET="main_window">
</HEAD>
<H3>Оглавление</H3>
<UL>
<LI>Товары
<UL>
<LI><A href="food.htm">Продукты питания</A>
<LI><A href="dress.htm">Одежда</A>
<LI><A href="shoes.htm">Обувь</A>
</UL>
<LI>Услуги
<UL>
<LI><A href="clothing_repair ">Ремонт одежды</A>
<LI><A href="cleaner.htm">Химчистка</A>
</UL>
</UL>
</BODY>
</HTML>
Атрибут TARGET каждой конкретной ссылки замещает одноименный атрибут тега <BASE>.
Пример
<!-- Файл фреймовой структуры frame.htm -->
<HTML>
<FRAMESET COLS="20٪,40٪,*" FRAMEBORDER="yes"
BORDER="5">
<FRAME src="left.htm"
NAME="toc_window">
<FRAME src="wares.htm"
NAME="wares_window">
<FRAME src="service.htm"
NAME="service_window">
</FRAMESET>
</HTML>
<!-- Файл оглавления left.htm -->
<HTML>
<HEAD>
<BASE TARGET="wares_window">
</HEAD>
<H3>Оглавление</H3>
<UL>
<LI>Товары
<UL>
<LI><A href="cosm.htm">Косметика</A>
<LI><A href="eat.htm">Пищевые добавки</A>
<LI><A href="perf.htm">Парфюмерия</A>
</UL>
<LI>Услуги
<UL>
<LI><A href="massage.htm"
TARGET="service_window">Массаж</A>
<LI><A href="manic.htm"
TARGET="service_window">Маникюр</A>
</UL>
</UL>
</BODY>
</HTML>
<!-- Файл заставки окна товаров wares.htm -->
<HTML>
<BODY>
<H1>Здесь товары!</H1>
</BODY>
</HTML>
<!-- Файл заставки окна услуг service.htm -->
<HTML>
<BODY>
<H1>Здесь услуги!</H1>
</BODY>
</HTML>