Заглавная страница Избранные статьи Случайная статья Познавательные статьи Новые добавления Обратная связь FAQ Написать работу КАТЕГОРИИ: ТОП 10 на сайте Приготовление дезинфицирующих растворов различной концентрацииТехника нижней прямой подачи мяча. Франко-прусская война (причины и последствия) Организация работы процедурного кабинета Смысловое и механическое запоминание, их место и роль в усвоении знаний Коммуникативные барьеры и пути их преодоления Обработка изделий медицинского назначения многократного применения Образцы текста публицистического стиля Четыре типа изменения баланса Задачи с ответами для Всероссийской олимпиады по праву
Мы поможем в написании ваших работ! ЗНАЕТЕ ЛИ ВЫ?
Влияние общества на человека
Приготовление дезинфицирующих растворов различной концентрации Практические работы по географии для 6 класса Организация работы процедурного кабинета Изменения в неживой природе осенью Уборка процедурного кабинета Сольфеджио. Все правила по сольфеджио Балочные системы. Определение реакций опор и моментов защемления |
Плаваючі фрейми (елемент IFRAME)Содержание книги
Поиск на нашем сайте Розмістити фрейм у звичайному HTML-документі (у межах елемента <BODY>) можна за допомогою елемента IFRAME. Фрейми, створювані цими елементами, називаються плаваючими. Уперше концепція плаваючих фреймів була реалізована компанією Microsoft у браузері Internet Explorer 3.0. Ім'я елемента плаваючого фрейму IFRAME походить від скорочення англійського терміна "inline frame" - рядковий фрейм. Контейнер < IFRAME > може розміщатися в будь-якому місці елемента <BODY>. Причому вміст, розміщений між тегами < IFRAME > і < /FRAME >, буде відображатися тільки браузерами, які не підтримують технологію плаваючих фреймів. Завдання плаваючого фрейму аналогічно опису елемента IMG. Основні припустимі атрибути тегу < IFRAME >: · src - задає URL-адресу файлу, що завантажується; · width, height - визначають ширину й висоту плаваючого фрейму; · align - установлює вирівнювання фрейму щодо вікна браузера; · marginwidth, marginheight, frameborder і scrolling - призначають розміри вільних полів між видом рамки фрейму й смуг прокручування; · name - задає ім'я фрейму, використовується при визначенні цільового фрейму. На відміну від звичайних фреймів, розміри плаваючого фрейму не можуть бути змінені відвідувачем сторінки, тому в число припустимих атрибутів тегу <IFRAME> не входить noresize. Приклад: <HTML> <HEAD> <ТIТLЕ>Історія обчислювальних машин </ТІТLЕ> </HEAD> <BODY> <Н2>Перше покоління ЕОМ</Н2> <!- Вміст основної частини документа -> <IFRAME name="stepl" src="compmach.html" height=180 align="right"> </IFRAME> <!- Уміст основної частини документа -> </BODY> </HTML>
Завдання до лабораторної роботи Завдання №1. 1. Створити за допомогою редактора Dreamweaver чотири Web-документи, зберегти їх в одній папці з ім'ям ФРЕЙМ (у цій же папці зберігається основний документ). 2. Створити документ із фреймовою структурою, аналогічно запропонованому прикладу (при цьому назви файлів необхідно використовувати свої):
<html> <head><title>Фрейми</title></head> <frameset rows="25%,50%,25%"> <frame src="f1.htm"> <frameset cols="25%,75%">*/ вкладений фрейм*/ <frame src="f3.htm"> <frame src="m1.htm"> </frameset> <frame src="f2.htm"> </frameset> </html> Завдання №2. 1. Створіть HTML-документ, який містить чотири фрейма, використовуючи для цього документи k 1-1. html, k 2-1. html, k 3. html, k 4. html (дивись нижче) і збережіть їх в одній папці, назва папки FRAME. 2. Змініть колір фону кожної сторінки, використовуючи атрибут bgcolor тегу BODY: на сторінці 1 вкажіть колір FF00FF, на сторінці 2 - 00FF00, на сторінці 3 - FFFF00, на сторінці 4 – FFFFFF. 3. Базовий HTML- документ збережіть з назвою web. html. Файл k1-1.html <HTML> <HEAD><TITLE>Кадр. Сторінка 1</TITLE></HEAD> <BODY BGCOLOR="#FF00FF"> Кадр 1 рожевого кольору </BODY> </HTML>
Файл k2-1.html <HTML> <HEAD><TITLE>Кадр. Сторінка 2</TITLE></HEAD> <BODY BGCOLOR="#00FF00"> Кадр 2 зеленого кольору </BODY> </HTML>
Файл k3.html <HTML> <HEAD><TITLE>Кадр. Сторінка 3</TITLE></HEAD> <BODY BGCOLOR="#FFFF00"> Кадр 3 жовтого кольору </BODY> </HTML>
Файл k4.html <HTML> <HEAD><TITLE>Кадр. Сторінка 4</TITLE></HEAD> <BODY BGCOLOR="#FFFFFF"> Кадр 4 білого кольору </BODY> </HTML>
Базовий документ web. html <HTML> <HEAD><TITLE>Демонстрація фреймів</TITLE></HEAD> <FRAMESET COLS="25%, 25%, 25%, 25%"> <FRAME SRC="k1-1.html"> <FRAME SRC="k2-1.html"> <FRAME SRC="k3.html"> <FRAME SRC="k4.html"> </FRAMESET> </HTML>
Завдання №3. 1. Створити на диску папку ФРЕЙМИ 2. Створити в редакторі Dreamweaver файли menu.html, 1.html, 2.html, 3.html, Index.html ( зміст файлів приведено нижче ) ізберегти їх у папці ФРЕЙМИ. Файл menu.html <html> <head><title>Untitled Document</title> <meta http-equiv=" Content-Type" content="text/html; charset= windows-1251"></head> <body bgcolor="#FFCCCC"> <h3> Меню </h3> <ol title="1" type="1"> <li> <a href="1.htm" target="main">перший </a></li> <li> <a href="2.htm" target="main">другий</a> </li> </ol> </body> </html> Файл 1.html <html> <head><title>Untitled Document</title> <meta http-equiv=" Content-Type" content="text/html; charset= windows-1251"></head> <body bgcolor="#99FF00"> <h4> перший файл, завантажений у головний фрейм </h4> </body> </html> Файл 2.html <html> <head><title>Untitled Document</title> <meta http-equiv=" Content-Type" content="text/html; charset= windows-1251"></head> <body bgcolor="#0099FF"> <h2> другий файл, завантажений у головний фрейм </h2> </body> </html> Файл 3.html <html> <head><title>Untitled Document</title> <meta http-equiv=" Content-Type" content="text/html; charset= windows-1251"></head> <body bgcolor="#FFFF33"> <h5> третій файл, завантажений у вкладений третій фрейм </h5> </body> </html> Файл Index.html <html> <head><title>Untitled Document</title> <meta http-equiv=" Content-Type" content="text/html; charset= windows-1251"></head> <frameset cols="25%,*"> <frame name="menu" marginheight="3" margin bordercolor="#00FF99" src="menu.htm"> <frameset rows="85%,*"> <frame name="main" marginheight="4" scrolling="yes" frameborder="yes" bordercolor="#FF6600" src="1.htm"> <frame name="logo" src="3.htm"> </frameset> </frameset> </html> 3.Проаналізувати роботу програму, запустивши файл Index.html. Завдання №2. 1. Створити в редакторі Dreamweaver будь-які шість файлів, з яких один буде файлом меню. Файл меню буде називатися menu.html і мати такий вигляд:
де «Перший», «Другий», «Третій» та «Четвертий» – гіперпосилання на інші файли. 2. Завантажити будь-які із створених п'яти файлів у фреймову структуру наступного виду (у відсотках зазначені розміри фреймів):
Завдання №3. 1. Використовуючи шість створених файлів з попереднього завдання. Створити фреймове меню з панеллю навігації наступного виду:
2. Додати в кожний із файлів плаваючий фрейм.
Контрольні питання: 1. Яка структура фреймового документа? 2. Для чого використовується тег Noframes? 3. Які атрибути визначають колір і розміри рамок? 4. Які атрибути визначають кількість і розміри фреймів? 5. Які типи файлів можу бути розміщені у фреймах? 6. Як організується плаваючий фрейм? 7. Як завантажити документ усередину зазначеного фрейму? 8. Назвіть атрибути, відповідальні за рамки й поля фреймів? 9. Як забрати поля прокручування? 10. Як організувати панель навігації? Лабораторна робота №6 Мета: вивчити призначення карт зображень; опанувати технологію створення карт зображень в HTML-документах. Навчитися озвучувати web-сторінки.
|
|||||||||||||||
|
Последнее изменение этой страницы: 2020-12-09; просмотров: 234; Нарушение авторского права страницы; Мы поможем в написании вашей работы! infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 216.73.217.128 (0.01 с.) |