КАТЕГОРИИ:
Архитектура-(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)
Лабораторная работа № 8. Создание web-сайта средствами редактора Dreamweaver (папка web-6)
|
|
|
|
На кнопке можно разместить поясняющий текст, а, создав несколько кнопок, получим меню. Если сохранить этот ролик как HTML-страницу, то можно использовать ее код для формирования общего дизайна сайта.
Укажем URL страницы, которая должна вызываться по нажатию на кнопку и тип окна (новое, тоже и т.д.) куда будет выводиться страница.
Упражнение 6 Создание собственных кнопок
1. Создадим новый файл.
2. Нарисуем кнопку.
3. Выделим кнопку с помощью инструмента 
и преобразуем её в символ (Insert, Convert to Symbol…). Дать символу название «Кнопка», тип «Button».
4. Удалим символ с холста. Откроем библиотеку (Windows, Library), выполним двойной щелчок по изображению символа «Кнопка».
5. Переключимся на таймелане в кадр «Over», вставим пустой кадр (Insert, Key Frame).
6. Отредактируем кнопку (например изменим её цвет, сделаем надпись).
7. Переключимся на таймелане в кадр «Down», вставим пустой кадр (Insert, Key Frame).
8. Отредактируем кнопку.
9. Переключимся на таймелане в кадр «Hit», вставим пустой кадр (Insert, Key Frame), таким образом мы задаем область реагирования.
10. Перейдём на сцену1 (Scene1).
11. Из библиотеки на холст перетащим кнопку на холст и зададим ей свойства (см пп.4,5 Упражнения 5).
13. Просмотрим получившийся мини клип – Control, Play.
Задания для самостоятельной работы
1. Создайте сайт из трех страниц с помощью технологии Flash.
2. Создайте анимированный ролик с управляющими кнопками (Play, Stop). Сценарий анимации разработайте самостоятельно.
Процедуры Play и Stop выглядят следующи образом:
on(press){Play();}
on(press){Stop();}
Основные требования:
- табличная структура (меню, контент, заголовок); сайт содержит 6 страниц; используются иллюстрации (в отдельной папке img).
1.Тема – Планирование сайта.
2. Опредилить структуру сайта (расположение меню, заголовков, контента)
Пример:
| ПЛАНИРОВАНИЕ САЙТА | |
| Процесс web-дизайна Этапы планирования Разработка ТЗ На главную | Контент |
| Об авторе гостевая книга |
3. Средставами dreamweaver создать файл стилей.
Пример: файл style.css
.zag{background-color:#ff0000; text-align:center; color:#000000}
.content{background-color:#00ff00; color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif}
.menu1{background-color:#0000ff; color:#000000}
A {text-decoration:none}
A:vizited{color:#000000}
A:hover{color:#000000; text-decoration:underline}
.menu2{background-color:#00ff00; color:#0000ff}
A:vizited{color:#000000}
A:hover{color:#ffffff; font-size:16; text-decoration:underline}
При создании файла стилей необходимо использовать дополнительные стилевые свойства (из файла «Стилевые свойства»)
4. Создать средствами Dreamweaver первую страницу index.htm, со ссылкой на файл стилей (в каждом из четырех разделов молульной сетки необходимо прописать используемый класс!)
Например:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Планирование сайта</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<table width="100%" height="100%" border="0" cellpadding="5" cellspacing="5">
<tr >
<td height="20%" colspan="2" class="zag" >Заголовок</p></td>
</tr>
<tr>
|
|
|
|
|
Дата добавления: 2015-05-26; Просмотров: 851; Нарушение авторских прав?; Мы поможем в написании вашей работы!