HTML & WEB презентация

Содержание

Основы HTML Термин "гипертекст" ввел в 1965 году американец Тед Нельсон. Автор термина понимал под ним "ветвящийся текст, выполняющий действия по запросу". То есть, текст, содержащий ссылки на другие фрагменты, структурированный

Слайд 1HTML & WEB
HyperText Markup Language


Слайд 2Основы HTML
Термин "гипертекст" ввел в 1965 году американец Тед Нельсон. Автор

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

Развитие стандартов HTML
В 1969 году был создан язык – GML (Generalized Markup Language).
22 декабря 1995 – принят стандарт HTML 2.
1996 – консорциумом W3C принята спецификация CSS1.
14 января 1996 – принят стандарт HTML 3.2.
18 декабря 1997 – принят стандарт HTML 4.0.
24 декабря 1999 – принят стандарт HTML 4.01.
1999 – принята спецификация CSS2.
26 января 2000 – принят стандарт XHTML 1.0.
16 февраля 2007 – принят стандарт XHTML 1.1.

Уровни html
В 1994 году HTML был разбит на уровни. Было выделено 4 уровня:
Уровень 0: включает в себя заголовки, ссылки, списки.
Уровень 1: добавляются рисунки и элементы выделения текста.
Уровень 2: добавляются формы, позволяющие пользователю вводить информацию.
Уровень 3: добавляются таблицы.

Слайд 3Особенности HTML5
HTML 5 – это, скорее, новая платформа для создания веб

– приложений, нежели стандарт продолжающий традиции предшественников.
HTML 5 регламентирует взаимодействие с JavaScript посредством объектной модели документа.
HTML 5 поддерживает все элементы HTML 4.

Слайд 4Теги
Html – HyperText Markup Language – язык разметки гипертекста. HTML не

является языком программирования, он предназначен для разметки текстовых документов. То, как будут выглядеть картинки, текст, таблицы и другие элементы на странице, и как они будут располагаться относительно друг друга, определяют метки (теги – от англ. tag).
Тег HTML состоит из следующих друг за другом в определенном порядке элементов:
левой угловой скобки “<“(такой же символ, как "меньше чем")
имени тега, например title или head
необязательных атрибутов (атрибуты записываются по следующей схеме: имя атрибута ="значение")
необязательного слэша “/ “, который означает, что тег является конечным тегом, закрывающим некоторую структуру.
правой угловой скобки “ > “ (такой же, как символ "больше чем").
Совокупность открывающего (<…>) и закрывающего () тегов – называется контейнером. Контейнер может содержать внутри себя другие теги. Например: <тег1><тег2><тег3>…< /тег3>. Тег который мы открыли первым – закрывается последним.

Слайд 5Существует множество простых и сложных программ для написания страниц HTML. Одной

из таких программ является стандартный блокнот (Notepad).

Написание страниц принято начинать с более или менее универсального шаблона:


Шаблон


Это шаблон web – странички.





Шаблон документа


Слайд 6Шаблон документа
1. Выбрать файл → Сохранить как (File →Save as)


Слайд 7Итак, все, что находится между и - это тег.

Текст, не находящийся между такими скобками весь виден при просмотре в браузере !
Шаблон открывается тегом - это самый главный из тегов. Он должен всегда открывать ваш документ, также как тег должен непременно стоять в последней его строке. Эти теги обозначают, что находящиеся между ними строки представляют именно единый HTML документ, а не какой-то другой файл.
Контейнер … - это голова документа. Все теги, расположенные внутри данного контейнера – это что-то вроде служебной информации. Элементы, находящиеся внутри контейнера head (кроме названия документа, записываемого с помощью контейнера title), не видны на экране, во всяком случае, напрямую.
Внутри данного контейнера могут находиться следующие элементы:




Шаблон документа


Слайд 8Между тегами … записывается название документа и представляет собой текстовую строку.

Название появляется в заголовке окна браузера.

Шаблон документа



Слайд 9В заголовок добавлен еще один функциональный тег, тег
Этот элемент

определяет для документа набор свойств, которые задаются в виде свойства/значение. В качестве этих свойств могут выступать: имя автора, список ключевых слов, кодировка страницы и многие другие. Все свойства задаются в виде значения атрибута name, либо http-equiv, а далее в content значение этих свойств.
Значения атрибута name:

author - Определяет имя автора документа. Синтаксис:


generator - Этот параметр очень любят редакторы Html документов, и просто выдают ваше неумение все сделать ручками. Синтаксис:


keywords - задает ключевые слова для поиска страницы. Синтаксис:

Шаблон документа


Слайд 10description - Задает краткое описание Вашей страницы. Синтаксис:

текст">

content-type - этот параметр описывает тип содержания документа и кодировку в которой он сделан. Синтаксис:


Слова text/html - это тип содержания документа, т.е. это есть текст в формате HTML. Далее charset - это кодировка символов, она может принимать следующие значения: windows-1251, koi8-r, ISO-8859-1 и т.д.

Ещё одним из важных параметров является параметр refresh. Синтаксис:

Браузеры поймут эту строку как инструкцию ожидать 60 секунд, а затем загрузить документ, находящийся по адресу, указанному в URL.

Шаблон документа


Слайд 11После контейнера head идет контейнер body. В этот контейнер помещают содержимое

страницы. Кроме того он может установить очень много параметров страницы с помощью своих атрибутов.

bgcolor устанавливает цвет фона документа.
text устанавливает цвет отображаемых символов.
link Это цвет, которым будут отображаться ссылки на другие документы.
vlink Этим цветом выделяются уже посещенные ссылки (Visited LINKs).
alink Этот цвет для того, чтобы помечать ссылки активные в данный момент (Active Link).

Шаблон документа


Слайд 12background Этот параметр задает фоновое изображение.
bgproperties Если установлено значение fixed,

фоновое изображение не прокручивается.
leftmargin Устанавливает границу левого поля в пикселях.
topmargin Устанавливает границу верхнего поля в пикселях.
rightmargin Устанавливает границу правого поля в пикселях.
bottommargin Устанавливает границу нижнего поля в пикселях.

Пример группирования:

Шаблон документа


Слайд 13Шаблон документа
Цвет во всех этих параметрах задается в следующем формате: #RRGGBB


где R (red - красный), G (green - зеленый), B (blue - синий)- это составляющие компоненты цвета в шестнадцатеричной форме.
Для простоты в HTML определены 16 стандартных цветов.

Слайд 14Шаблон документа


Слайд 15Шаблон документа


Слайд 16Шаблон документа


Слайд 17
Определение цвета составных частей документа – первый шаг в его создании.

Если это не сделано, используются цвета по умолчанию. Они определяются установками программы просмотра.

Примечание: Так как вы не можете знать, какие цвета использует по умолчанию браузер вашего читателя, лучше всего определить все цветовые атрибуты. Тогда заведомо один и тот же цвет не будет использован, например, для текста и фона.

Включение комментариев: В HTML документ можно включать комментарии, которые не будут видны вашему читателю. Они должны начинаться тегом Все, что заключено внутри этих тегов, при просмотре страницы остается невидимым.

Цветовое оформление


Слайд 18
HTML предполагает, что автор документа ничего не знает о компьютере своего

читателя. Читатель вправе установить любой размер окна и пользоваться любым из имеющихся у него шрифтов. Это означает, что место переноса в строке определяется только программой просмотра и установками конечного пользователя, что может превратить документ в сплошной неудобочитаемый текст в окне программы просмотра.
Избежать этой неприятности позволяют элементы форматирования текста.

Одним из таких элементов является тег абзаца. Поместите открывающий тег

в начало каждого нового абзаца вашего текста, и программа просмотра отделит абзацы друг от друга пустой строкой.

Форматирование текста


Слайд 19В HTML несколько стоящих подряд тегов не дают дополнительного пространства

между абзацами.
Тег абзаца имеет один атрибут. Это атрибут align, имеющий следующие значения:
left выравнивает абзац по левой границе окна браузера
center выравнивает абзац по центру
right выравнивает абзац по правой границе окна браузера
Синтаксис:



Каждый последующий абзац игнорирует, заданное для предыдущего абзаца значение align.

Форматирование текста


Слайд 20Для того чтобы перейти на следующую строку в HTML существует тег

разрыва строки
Он заставляет программу просмотра выводить стоящие после него символы с начала новой строки. В отличие от тега абзаца, тег
не добавляет пустую строку. Вдобавок он не имеет соответственного закрывающего тега.

There will never be

Another one like you

There will never be

Another one who can

Do the things you do....


Форматирование текста


Слайд 21Для того чтобы текст смотрелся интереснее, попробуем придать ему определенную структуру.

Для удобства читателей текст рекомендуется разбить на логические части, каждая из которых посвящена отдельной теме.
После того как это будет сделано, каждой части текста следует дать смысловой заголовок с целью облегчить поиск нужной темы.
Теги заголовков являются одними из самых употребляемых в языке разметки гипертекста.
Элемент "заголовок" является контейнером и поэтому должен иметь открывающий (

) и закрывающий (

) теги. HTML располагает шестью уровнями заголовков: h1 (самый верхний), h2, h3, h4, h5 и h6 (самый нижний).
Элемент "заголовок" предполагает автоматическую вставку пустых строк до и после него. У заголовка есть два атрибута: align и title – задает всплывающую подсказку.
Синтаксис:
где n=1,2,3,…,6

Структурирование текста


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


Заголовок первого уровня


Заголовок второго уровня


… … …
Заголовок шестого уровня



Структурирование текста


Слайд 23Другим методом разделения документа на части является проведение горизонтальных линий. Они

визуально подчеркивают законченность той или иной области страницы.
Элемент
позволяет провести горизонтальную линию в окне большинства программ просмотра.
Тег
имеет следующие атрибуты:
align – выравнивает горизонтальную линию. Имеет следующие значения:
left – выравнивает по левому краю
right – по правому
center – по центру
width – устанавливает длину линии в пикселях или процентах от ширины окна браузера (в этом случае добавляется символ %)
size – устанавливает толщину линии в пикселях
noshade – отменяет тень линии
color – указывает цвет линии
Синтаксис:


Структурирование текста


Слайд 24Логическое форматирование и четкое структурирование являются признаками хорошо составленного документа. Они

обеспечивают большую гибкость в его использовании. Помня об этом, разработчики HTML создали целую группу форматирующих элементов, согласно своему назначению названных логическими.
Преимущество этого подхода в том, что документ не привязывается к какой-нибудь определенной платформе. Хотя внешний вид документа может слегка измениться, содержание и структура останутся теми же самыми.
В HTML существует целая группа элементов логического форматирования:
Используется для выделения цитат или названий книг и статей, при этом текст обычно выводится курсивом.
Применяется для вывода небольшого куска программного кода (для больших листингов используется тег
) шрифтом фиксированной ширины.
Этот элемент обычно используется для выделения важных фрагментов текста. Браузеры обычно отображают такой текст курсивом.
Элемент, выделяющий шрифтом фиксированной ширины текст, вводимый пользователем с клавиатуры.
Используется для выделения нескольких символов шрифтом фиксированной ширины.
Этот элемент обычно используется для выделения важных фрагментов текста. Браузеры обычно отображают такой текст полужирным шрифтом.
Используется для отметки имен переменных. Обычно такой текст отображается курсивом.

Логическое форматирование


Слайд 25Возможно, вам захочется включить в документ какую-либо длинную цитату. Для выделения

цитаты из основного текста в HTML существует элемент
. Этот элемент является контейнером и может содержать любые форматирующие теги.
Современные браузеры реагируют на элемент
смещением текста цитаты вправо. Некоторые текстовые программы просмотра обозначают цитату символами >, располагающимися в крайнем левом столбце экрана. Так как сегодня большинство браузеров являются графическими программами, элемент < blockquote > позволяет авторам внести в текст некоторое визуальное разнообразие.

Элемент blockquote


Слайд 26Последней "инстанцией" определения внешнего вида вашего документа, как отмечалось уже неоднократно,

является программа просмотра читателя. Вы имеете ограниченные возможности повлиять на этот процесс с помощью элементов физического форматирования:
Выделяет текст полужирным шрифтом.
Выделяет текст курсивом.
Выводит текст шрифтом фиксированной ширины.
Элемент подчёркивания.
Элемент зачеркивания. Отображается текст, перечеркнутый горизонтальной линией.
Выводит текст шрифтом большего размера.
Выводит текст шрифтом меньшего размера.
Сдвигает текст ниже уровня строки и выводит его (если возможно) шрифтом меньшего размера.
Сдвигает текст выше уровня строки и выводит его (если возможно) шрифтом меньшего размера.


Физическое форматирование


Слайд 27Задание вывести следующую формулу
Физическое форматирование


Слайд 28Элемент font представляет собой контейнер, т. е. требует как открывающего, так

и закрывающего тегов. После стартового тега обязательно идет указание атрибутов, без которых элемент не оказывает никакого влияния на текст, помещенный в контейнер. Элемент font может использоваться внутри любого другого текстового контейнера.
Имеет следующие атрибуты:
face – позволяет указать тип шрифта, которым программа просмотра выведет ваш текст (если таким располагает пользователь). Параметром атрибута служит название шрифта, которое должно в точности совпадать с названием шрифта, имеющегося у пользователя.
size – служит для указания размера шрифта в условных единицах от 1 до 7. Размер может быть указан как абсолютной величиной (size="5"), так и относительной (size="+2"). Последний метод чаще употребляется вместе с basefont.
Color – устанавливает цвет шрифта.
Синтаксис:

Тег FONT


Слайд 29Тег служит для указания размера, типа и цвета шрифта, стандартных

для данного документа. Эти величины обязательны для всего документа, если только не переназначаются при помощи элемента font.
После закрытия элемента font значения тэга восстанавливаются. Значения атрибутов basefont могут быть изменены другим тегом в любом месте документа. Обратите внимание, что это не контейнер и закрывающего тега не существует.
Тег использует те же самые атрибуты, что и элемент font.

Тег BASEFONT


Слайд 30Рассмотрим пример:


Шаблон

This text is before the BASEFONT tag.

is after the BASEFONT tag.
Size changes are relative to the basefont
SIZE.
This text is after the closing font tag


Тег BASEFONT


Слайд 31Различают форматы растровых и векторных изображений. Растровые изображения хранятся в файлах

с расширениями jpg, gif, bmp, tiff, png, psd. Векторные – swf, cdr, max, ai.
В веб - разработке используются JPEG, PNG и GIF для растровой графики и SWF для векторной. Все три формата для растровой графики используют сжатие графической информации.
Формат GIF позволяет создавать анимированные картинки. Этот формат является сжатым, и допустимое количество цветов в нем 256. Сжатие происходит без потерь, т.е. изображение записывается без каких-либо преобразований.
Формат JPEG также является сжатым, и применяется для изображений требующих большое количество цветов вплоть до 16 млн. Сжатие происходит после оптимизации и поэтому происходят потери в качестве. Размер файла сильно зависит от требуемого качества изображения, которое может иметь около 12 уровней качества (от очень плохого до наилучшего).
Стандарт PNG позволяет создавать изображения в 16 млн. цветов без потери в качестве. Но из-за этого занимает намного больше места, чем JPEG.

Форматы изображений


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

совместно с атрибутом src, поместив их в нужное место вашего HTML-документа.
Синтаксис:

По умолчанию браузер выводит изображение немедленно после текста или другого объекта, описанного предыдущими инструкциями.
Помимо атрибута src тег имеет следующие атрибуты:
alt - Этот атрибут задает текст, который будет изображаться вместо картинки, если она не загрузилась или не отображается. Как правило в тексте указывается краткое описание изображения.

Вставка графики


Слайд 33align Задает расположение рисунка в окне браузера и его выравнивание относительно

текущей строки. Имеет следующие значения:
top - Выравнивает верхний край изображения по верхнему краю текущей строки.





middle Выравнивает центр изображения по базовой линии текущей строки.

Вставка графики


Слайд 34bottom Установка по умолчанию. Выравнивает нижний край изображения по базовой линии

текущей строки.






left Выравнивает изображение по левому краю окна браузера.
right Выравнивает изображение по правому краю окна браузера.
width - задает ширину области в пикселях, отводимой в окне под изображение.
height - задает высоту области в пикселях, отводимой в окне под изображение.



Вставка графики


Слайд 35hspace Используется для указания ширины пространства слева и справа от изображения

в пикселях.
vspace Используется для указания ширины пространства сверху и снизу от изображения в пикселях. Как правило по умолчанию равно 0. Но может быть и иным.
border Задает толщину рамки, которой будет обрисовываться изображение. Если изображение не является ссылкой, то оно по умолчанию не окружается рамкой. Если же это изображение-ссылка, то толщина рамки будет равна 2. Рамка иногда может портить стиль вашей страницы, тогда используйте border=0.



Вставка графики


Слайд 37Основы работы с видео и звуком
Предусмотрено два тега для работы с

аудио и видео соответственно:

Слайд 38Видео добавляется аналогичным образом:


Атрибуты тега :
autoplay – при

его добавлении, воспроизведение файла начинается сразу же после загрузки страницы;
controls – добавляет панель управления к видео;
height – задает высоту области, для воспроизведения видео.
loop – воспроизведение аудио повторяется с начала, после его завершения;
poster – указывает путь к изображению, пока видео не воспроизводится, или недоступно;
preload – используется для загрузки аудиофайла вместе с загрузкой самой страницы, игнорируется, если использован autoplay;
src – задает путь к файлу для воспроизведения.
width – задает ширину области, для воспроизведения видео.

Слайд 39Гиперссылки являются основным элементом HTML, позволяющим связывать отдельные страницы в единое

электронное издание. Гиперссылка состоит из двух частей. Первая из них – это то, что вы видите на WEB-странице; она называется указатель (anchor). Вторая часть, дающая инструкцию браузеру, называется адресной частью ссылки (URL-адресом, URL reference). Когда вы щелкаете мышью по указателю ссылки, браузер загружает документ, адрес которого определяется URL-aдpecoм. Составные части ссылки рассмотрены ниже. Кодируется гиперссылка с помощью тега :
Синтаксис:
Указатель
УКАЗАТЕЛИ:
Указателем ссылки может быть слово, группа слов или изображение. Текстовый указатель как правило представляется браузером синим цветом и подчеркивается. Графический указатель не подчеркиваются и не выделяется цветом, но вокруг него можно сделать рамку. Для того, чтобы задать графический указатель, надо вместо текста между тегами вставить нужное изображение с помощью тега .
Синтаксис:


Гиперссылки


Слайд 42Создание ссылки на электронную почту так же просто, как и на

другую страницу. Вместо http, определяющего Web-адрес, нужно ввести адрес электронной почты после слова mailto:
Send me E-mail.
Эта ссылка ничем не будет отличаться от остальных гипертекстовых ссылок вашего документа.

Гиперссылки


Слайд 43В HTML список состоит из тега-контейнера списка, определяющего его тип, и

стандартных тегов
  • , предваряющих каждый пункт списка. Упорядоченный список используется для нумерованного перечисления отдельных пунктов или указания последовательности каких-то действий. Когда программа просмотра встречает тег упорядоченного списка, она последовательно нумерует пункты списка: 1, 2, 3 и т.д.
    Упорядоченный список открывается тегом
      , а каждый его пункт начинается стандартным тегом
    1. . Для создания заголовка списка используется специальный тег . Список закрывается тегом
    . Открывающий и закрывающий теги обеспечивают перевод строки до и после списка, отделяя таким образом список от остального текста, поэтому здесь нет необходимости использовать теги абзаца

    . Упорядоченные списки допускают вложения друг в друга.

    Списки в HTML


  • Слайд 45Атрибуты тега
    type="A" Устанавливает маркер в виде прописных букв.
    type="а" Устанавливает маркер

    в виде строчных букв.
    type=«I" Устанавливает маркер в виде больших римских цифр.
    type="i" Устанавливает маркер в виде маленьких римских цифр.
    type="1" Устанавливает маркер в виде арабских цифр.
    start="n" Устанавливает начальный маркер в текущем списке.

    Использование разных типов маркеров позволяет лучше выделять один список из другого.

    Списки в HTML


    Слайд 46Неупорядоченный список вместо буквенной или цифровой нумерации предполагает использование различных символов,

    называемых маркерами списка (bullets).

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

    Маркированный список имеет единственный атрибут type, который устанавливает вид маркера. Данный атрибут допускает три значения : disc, square и circle.

    Списки в HTML


    Слайд 47Списки определений, также называемые словарями специальных терминов (глоссариями), являются особым видом

    списков HTML. Они представляют текст в форме словарной статьи, состоящей из определяемого термина и абзаца, раскрывающего его значение.

    Элемент списка определений dl является контейнером и обеспечивает отделение списка от остального текста пустыми строками. Внутри контейнера тегом
    помечается определяемый термин, а тегом
    – абзац с его определением. Текст, стоящий за тегом
    , выводится отдельным абзацем с отступом вниз на одну или две строки (зависит от типа программы просмотра) относительно определяемого термина.

    Списки в HTML


    Слайд 48Для того, чтобы определить таблицу нужно воспользоваться тегом
    Тег представляет

    собой тег-контейнер, в котором размещается содержимое таблицы. Таблица строится по строкам: для обозначения строки используется контейнер , для обозначения заголовков столбцов (строк) – контейнер , а для данных в ячейках – контейнер . Заголовки выделяются полужирным шрифтом и центрируются в своих ячейках.
    В дополнении к этим тегам используются следующие атрибуты:
    align Задает выравнивание, допустимые значения: left-по левому краю, right-по правому краю, center-по центру. Задание этого атрибута в теге приводит к выравниванию таблицы относительно окна браузера, а в тегах или
    отражается на содержимом ячеек таблицы.
    bgcolor Используется в тегах , ,
    . Задает цвет фона.
    border Используется в теге . Задает толщину рамки таблицы. Если задать border="0", то границы ячеек становятся невидимыми
    cellpadding Атрибут тега
    , задает расстояние между границами и содержимым ячеек в пикселях
    cellspacing Атрибут тега
    , задает расстояние между ячейками таблицы в пикселях.

    Основы построения таблиц


    Слайд 49colspan Атрибут тега .Значение атрибута определяет сколько столбцов таблицы будет

    занимать данная ячейка.
    rowspan Атрибут тега
    .Значение атрибута определяет сколько строк таблицы будет занимать данная ячейка
    height Атрибут тега . Задает высоту таблицы
    width Атрибут тега
    . Задает ширину таблицы
    valign Атрибут тега и ), либо заполнить ее специальным символом пустого пространства   ().

    Основы построения таблиц


    Слайд 54До сих пор мы считали, что в каждый момент времени в

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


    Заголовок документа





    Фреймы


    Слайд 55Тег поддерживает два атрибута: cols и rows, один из которых

    обязательно необходимо включить в определение набора фреймов. Формат определения набора фреймов имеет вид:

    Или

    Атрибут cols предписывает браузеру разбить экран на несколько вертикальных фреймов, ширина которых определяется аргументами cols. Каждый аргумент отделяется от другого запятой. Вы можете определить ширину каждого фрейма либо непосредственно в пикселях, либо в процентах от оставшегося места, либо с помощью звездочки (*). При использовании звездочки, браузер отводит данному фрейму максимально возможную ширину.
    Следующее определение набора фреймов

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

    Фреймы


    Слайд 56Фреймы


    Слайд 57Атрибут rows выполняет те же функции, что и атрибут cols, за

    исключением того, что он создает горизонтальные фреймы.
    Если Вы теперь самостоятельно попытаетесь воспроизвести последний пример, закодировав теги , то обнаружите, что фреймы не отображаются. Такой результат связан с тем, что не определено содержимое для набора фреймов.
    Чтобы определить его, надо воспользоваться тегом вместе с атрибутом src.
    Синтаксис:

    Для предыдущего примера описание фреймов имеет вид :




    Слайд 58scrolling Регулирует появление полос прокруток. Имеет три значения:
    auto Если содержимое фрейма

    занимает больше места, чем ему отведено, то браузер автоматически добавляет вертикальную и горизонтальную полосы прокрутки, чтобы пользователь мог просмотреть оставшуюся часть документа в фрейме.
    no В данном случае полосы прокрутки не будут появляться ни при каких обстоятельствах
    yes Полосы прокрутки будут появляться всегда вне зависимости от потребности в них.
    noresize По умолчанию, пользователь может менять положение границ фреймов, перетаскивая их с помощью мыши. Для блокировки изменения размеров фрейма и предотвращения перемещения границ используется данный атрибут
    marginheight Позволяет указать размер верхнего и нижнего полей фрейма
    marginwidth Позволяет указать размер левого и правого полей фрейма
    name Имя фрейма.

    Фреймы


    Слайд 59Решим теперь вопрос о том, как работать с гиперссылками в HTML-страницах

    с фреймами. Если например в левом фрейме создать гиперссылку:
    Документ 1,
    то документ doc.html будет загружен в тот же фрейм. Для того, что бы загрузить документ в другом фрейме, нужно воспользоваться атрибутом target= " имя фрейма " тега

    Фреймы


    Слайд 60Фреймы


    Слайд 61В HTML существует три тега для создания различного типа полей в

    форме:
    задает вертикальное выравнивание содержимого в ячейках. Допустимые значения: top-по верхней границе ячейки, middle-по центру, bottom-по нижней границе.
    В ячейках таблицы можно помещать любые допустимые конструкции HTML в том числе и картинки и другие таблицы.
    Наличие в ячейках данных необязательно. Создать пустую ячейку можно двумя способами: ничем не заполнять ее контейнер (