Разделы презентаций

03.ppt

Содержание

ESC-последовательности - для того, чтобы представлять спецсимволы в тексте документа, заменять символьные объектыНекоторые служебные символы иногда необходимо отображать в тексте документаДля того, чтобы интерпретатор браузера не воспринимал их как команды, эти

Слайды и текст этой презентации

Слайд 1Лекция №3 HTML 4
ESC-последовательности
подключение нетекстовых ресурсов
фреймы
стандарт MIME-types
meta – теги
маппинг
формы




Лекция №3 HTML 4ESC-последовательностиподключение нетекстовых ресурсовфреймыстандарт MIME-typesmeta – тегимаппингформы

Слайд 2ESC-последовательности
- для того, чтобы представлять спецсимволы в тексте документа, заменять

символьные объекты

Некоторые служебные символы иногда необходимо отображать в тексте документа

Для

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

Синтаксис ESC последовательности:
&# код символа; (# – значок #)
& служебное слово;
ESC-последовательности - для того, чтобы представлять спецсимволы в тексте документа, заменять символьные объектыНекоторые служебные символы иногда необходимо

Слайд 3Символ

Служебное слово
<

<
> >
& amp;
“ "
© ©
@ @
неразрывный пробел  
Символ Служебное слово<

Слайд 4Теги для подключения
нетекстовых ресурсов

рисунки

объекты апплеты Java




Атрибуты:
alt="текстовое описание рисунка"
align=top || middle || bottom – выравнивание
title = "всплывающее текстовое описание"
Для вставки аудио и видео файлов:
текст

картинку можно использовать как маршрутизатор гиперссылки:

Теги для подключения нетекстовых ресурсоврисунки объекты

Слайд 5Объекты
для встраивания объектов в веб-документы применяются теги:













Объектыдля встраивания объектов в веб-документы применяются теги:

Слайд 6Контейнер


height - высота

объекта
width - ширина объекта
align - выравнивание
hidden - указывает, скрывать ли

объект на странице
pluginspace - aдрес страницы, откуда можно скачать и установить плагин к браузеру
src - путь к файлу
type - MIME-тип объекта
vspace - вертикальный отступ от объекта до окружающего контента
hspace - горизонтальный отступ от объекта до окружающего контента

Контейнер height - высота объектаwidth - ширина объектаalign - выравниваниеhidden - указывает, скрывать ли

Слайд 7Контейнер
…
height - высота объекта
width - ширина

объекта
align - выравнивание
classid - адрес программы (приложения или плагина), которая

работает с данным объектом, и будет запускать его
code - имя объекта для его выполнения
codebase - путь к папке с объектом, который указан атрибутом code или classid
codetype - указывает на тип объекта, который задан атрибутом classid
data - адрес файла для его отображения в окне браузера
tabindex - определяет порядок перехода между элементами с помощью клавиши Tab
type - MIME-тип объекта
vspace - вертикальный отступ от объекта до окружающего контента
hspace - горизонтальный отступ от объекта до окружающего контента

Внутри находятся теги

позволяют передать объекту
некоторые значения
Пример:
Контейнер … height - высота объектаwidth - ширина объектаalign - выравниваниеclassid - адрес программы (приложения или

Слайд 8Пример вставки объекта

Тег EMBED



src='heart.swf'
width='200'
height='200'
type='application/x-shockwave-flash'
pluginspaсe='http://www.macromedia.com/go/getflashplayer'>



просмотр примера
Пример вставки объектаТег EMBED просмотр примера

Слайд 9Фреймы
Позволяют разбивать Web-документ на кадры-подокна
Свойства фреймов:
Каждый фрейм имеет свой собственный

URL

Каждый фрейм имеет свое собственное имя (name), что позволяет переходить

из одного фрейма в другой

Размер фрейма может изменяться пользователем, если это не запрещено

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

Фрейм-документ является специфическим HTML-файлом:
не имеет тега
Фреймы Позволяют разбивать Web-документ на кадры-подокнаСвойства фреймов:Каждый фрейм имеет свой собственный URLКаждый фрейм имеет свое собственное имя

Слайд 10Структура фреймового документа

…

контент



Структура фреймового документа … контент

Слайд 11Задание фреймовых структур



Пример:

- делит экран на два фрейма, один шириной

100 px.
Cпособы задания размеров фрейма:
- пиксельный;
- с использованием заменяющего символа '*';
- с использованием %
Задание фреймовых структурПример: - делит экран на два фрейма, один шириной 100 px.Cпособы задания размеров

Слайд 12Атрибуты тега frameset:
border – толщина окаймляющей линии
frameborder – толщина разграничительной

линии

Внутри можно разместить нужное количество тегов

src=‘url документа, который должен загружаться в этот фрейм’
name='MyFrame'>
Атрибуты тега frameset:border – толщина окаймляющей линииframeborder – толщина разграничительной линииВнутри можно разместить нужное количество тегов

Слайд 13атрибут name может принимать собственное имя фрейма, чтобы указать, какому

фрейму использовать ссылку

Пример задания фрейма

атрибут name может принимать собственное имя фрейма, чтобы указать, какому фрейму использовать ссылкуПример задания фрейма

Слайд 15если браузер не поддерживает фреймы,
то используется контейнер
текст документа

Дополнительные атрибуты

тега

– запрещает изменение размера
marginwidth – ширина боковых разделительных полос между фреймами
marginheight – ширина верхних и нижних разделительных полос

если браузер не поддерживает фреймы, то используется контейнертекст документаДополнительные атрибуты тега

Слайд 16Особенности применения атрибута target

Первый фрейм – главный, каждая ссылка должна

содержать атрибут, который позволяет вернуться к главной странице

Если собственные имена

фреймов начинаются с символа '_'
– это целевые фреймы:

_blank –документ будет появляться в новом пустом окне

_self – новая страница будет появляться в том же окне

_parent – все документы, вызываемые по этой ссылке, будут появляться в родительской фреймовой структуре

_top – документы появляются в отдельном нефреймовом окне, для просмотра будет сгенерировано новое окно


Вложенность фреймов затрудняет навигацию
Особенности применения атрибута targetПервый фрейм – главный, каждая ссылка должна содержать атрибут, который позволяет вернуться к главной

Слайд 17
плавающий фрейм, находится внутри документа,
позволяет загружать в область заданных

размеров другие документы.
Свойства:
содержание игнорируется браузерами, не поддерживающими данный тег.


Для таких браузеров - альтернативный текст внутри

А т р и б у т ы

align - определяет как фрейм будет выравниваться по краю, и способ обтекания его текстом

allowtransparency устанавливает прозрачный фон фрейма

frameborder - устанавливает, отображать границу вокруг фрейма или нет

height - высота фрейма
width - ширина фрейма



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

Слайд 18 (2)
hspace - горизонтальный отступ от фрейма до окружающего контента

marginheight

- отступ сверху и снизу от содержания до границы фрейма

marginwidth

- отступ слева и справа от содержания до границы фрейма

name - имя фрейма

sandbox - ограничения на контент, загружаемый во фрейме

scrolling - способ отображения полосы прокрутки во фрейме

seamless - определяет, что содержимое фрейма должно отображаться так, будто является частью документа

src - путь к файлу, содержимое которого будет загружаться во фрейм

srcdoc - хранит содержимое фрейма непосредственно в атрибуте

vspace - вертикальный отступ от фрейма до окружающего контента

(2)hspace - горизонтальный отступ от фрейма до окружающего контентаmarginheight - отступ сверху и снизу от содержания

Слайд 19Пример

пример с IFRAME




width="468" height="400"
align="right" frameborder="0">
Ваш браузер не поддерживает

IFRAME


name="имя переменной" value="значение по умолчанию"
size="10"
maxlength="100">

size – длина видимой части строки

1) Кнопка Submit – создает объект

Слайд 363) Поле для ввода пароля

value="Иванов">

небезопасно!

4) Многострочный текст


3) Поле для ввода паролянебезопасно!4) Многострочный текст

Слайд 37 5)Радиокнопка

name="color" value="red" checked=‘checked’>
Пример:
Выберите цвет:


Красный

green"
checked=‘checked’>
Зеленый


Синий






5)РадиокнопкаПример:Выберите цвет:КрасныйСиний

Слайд 399) Объект SELECT (выпадающий список)

“значение 1”>название опции название опции …

9) Объект SELECT (выпадающий список) название опции название опции …

Слайд 40Тег для группировки элементов в форме – создает рамку

вокруг элементов формы

Тег - создает заголовок для элементов формы,

объединенных в группу тегом



Заполните форму:

enctype="text/plain">

…



Тег для группировки элементов в форме – создает рамку вокруг элементов формыТег - создает заголовок для элементов

Слайд 41Пример формы
Заполните форму:

action="mailto:someaddress@kture.kharkov.ua"
method=“post” encoded=“url-encoded”>
Расскажите немного о себе...


Указывать подлинные данные совсем не обязательно


Имя: < input type=“text” size=“40” name=“fn”>

Фамилия: < input type=“text” size=“40” name=“ln”>

Пол: < input type=“radio” name=“gender: value="male" checked>мужской
женский

Возраст: лет


Выберите род
Ваших занятий:




< input type=“hidden” name=“author” value= "somebody" >

< input type="button" value="Test" onClick="formTest()">
< input type=“reset” value="Очистить поля формы">
< input type=“submit” value="Отправить заполненную форму" onClick="return SendForm()">



мужской женский Возраст: лет Выберите род Ваших занятий:">Пример формы Заполните форму: Расскажите немного о себе... Указывать подлинные данные совсем не обязательно Имя:

Слайд 42Просмотр работы формы

Просмотр работы формы

Похожие презентации

F1003007-template F1003007-template 193
Файлы в Паскале Файлы в Паскале 319
Строение и эволюция Вселенной Другие звёздные системы — галактики Строение и эволюция Вселенной Другие звёздные системы — галактики 444
Скульптуры Стерлитамака Скульптуры Стерлитамака 257
Наружные стены зданий и их элементы Наружные стены зданий и их элементы 297
Религия Религия 210
Билль о правах США XIX - XXвв .odp Билль о правах США XIX - XXвв .odp 430
Самые красивые места мира Самые красивые места мира 1027
Котельные установки и парогенераторы Эксплуатация энергетических паровых Котельные установки и парогенераторы Эксплуатация энергетических паровых 250
Массивы - решение простых задач Массивы - решение простых задач 271
Царство Грибы Царство Грибы 322
ТУРИСТСКИЕ ФИРМЫ И ЭКСКУРСИОННЫЕ МАРШРУТЫ г. СОЧИ ТУРИСТСКИЕ ФИРМЫ И ЭКСКУРСИОННЫЕ МАРШРУТЫ г. СОЧИ 225
Презентация Аминева Алина.ppt Презентация Аминева Алина.ppt 476
БЕЗОПАСНОСТЬ НА ВОДЕ БЕЗОПАСНОСТЬ НА ВОДЕ 204
Автоматизация звуков при дизартрии с использованием тактильно-кинестетической Автоматизация звуков при дизартрии с использованием тактильно-кинестетической 292
Сложные слова, которые обозначают внешность человека и черты его характера Сложные слова, которые обозначают внешность человека и черты его характера 404
ТЕХНИЧЕСКАЯ ТЕРМОДИНАМИКА ТЕХНИЧЕСКАЯ ТЕРМОДИНАМИКА 369
Не просто петь слова Не просто петь слова 205
Украинское бароко Украинское бароко 286
Contact Number +9188 -0050-0739 DISCLAIMER- To be one of the most demanded Contact Number +9188 -0050-0739 DISCLAIMER- To be one of the most demanded 183

Обратная связь

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

Email: Нажмите что бы посмотреть 

Что такое TheSlide.ru?

Это сайт презентации, докладов, проектов в PowerPoint. Здесь удобно  хранить и делиться своими презентациями с другими пользователями.

Для правообладателей

Яндекс.Метрика