Основные понятия и теги. Основные понятия WWW (Word Wide Web) – cистема навигации, поиска и доступа к мультимедийным средствам с помощью средств гипертекста.

Презентация:



Advertisements
Похожие презентации
Основы Html HTML – HyperText Markup Language – язык разметки гипертекста
Advertisements

(HyperText Markup Language) – язык гипертекстовой разметки.
HTML (HyperText Markup Language). Основные понятия Элемент – конструкция языка HTML. Он состоит из 3 частей: открывающий тег, содержимое, закрывающий.
Название страницы содержание страницы Структура любого HTML файла.
HTML (HyperText Markup Language). Основные понятия Элемент – конструкция языка HTML. Он состоит из 3 частей: открывающий тег, содержимое, закрывающий.
РАЗМЕЩЕНИЕ ИНФОРМАЦИИ В ИНТЕРНЕТ РАЗРАБОТКА WEB-ПРИЛОЖЕНИЙ.
Язык гипертекстовой разметки. Copyright Baltazar and Mirron corp.
Разбиение Web-страницы на независимые окна. Кадры (frames) (позволяют разбивать страницу на независемые окна) Позволяет задавать кадровую структуру (страница.
Язык HTML Web-дизайн Web – World Wide Web (WWW) Всемирная паутина. Design – проектирование, конструирование. Web-дизайн – проектирование в Интернете.
Язык разметки гипертекста НТМL (HyperText Markup Language)
Форматирование текста на Web-странице Пока наша страница выглядит не слишком привлекательно: мелкий шрифт чёрного цвета на белом фоне. С помощью тэгов.
HTML (HyperText Markup Language) - Язык Разметки Гипертекста.
Т а б л и ц ы в. Таблица в HTML организуется как набор столбцов и строк. Таблицы являются стандартом HTML. В первом приближении таблица Web-страницы –
1 Web-конструирование Шестаков Александр Петрович
Тэг - создает таблицу. Все прочие элементы таблицы – текст, рисунки, списки - должны быть вложенными в него. Допускается также вложение таблиц одна в.
Форматирование текста Вставка графики, видео, звука Структура HTML-документа Назначение и основные понятия Создание списков и таблиц Служебные теги Бегущая.
Язык HTML HyperText Markup Language Язык разметки гипертекста.
© Пивоваров Я.А., 2005 г. Появление HTML пришлось на начало 90-х годов благодаря двум протоколам, которые являются базовыми для Internet – TCP (Transmission.
Язык разметки гипертекста. Терминология HTML. Методика использования. Основные конструкции. Лаборатория информатизации образования ИДППО Институт дополнительного.
Oсновы HTML Hyper Text Markup Language. Идеологи Тим Бернерс-Ли британский учёный (1989) Тед Нельсон - американский социолог, изобретатель гипертекста.
Транксрипт:

основные понятия и теги

Основные понятия WWW (Word Wide Web) – cистема навигации, поиска и доступа к мультимедийным средствам с помощью средств гипертекста. Браузер – программа просмотра гипертекстовых страниц WWW. Гипертекст – текст, содержащий связи с другими текстами, графической, видео- или звуковой информацией). HTML (Hypertext Markup Language) – язык разметки гипертекста. HTML-документы представляют собой текстовые файлы, в которые встроены специальные команды. Тэги (tags) – команды языка HTML

Атрибуты дополняют тэги, позволяя описывать внешний вид части страницы, окружённой тэгами CGI (Common Gateway Interface) – это протокол для выполнения сценариев на серверах; в свою очередь серверы осуществляют конечную обработку, например связь с базой данных по запросу со страницы Web. Все коммерческие серверы Web поддерживают сценарии CGI. Сценарии CGI пишутся на Perl, а программы CGI – на С++ или других компилируемых языках. Java – язык программирования компании JavaSoft синтаксически подобен C++, но он предусматривает такие ограничения, как запрет на использование указателей..

Приложения Web могут выполняться внутри операционной системы, или браузера Web, или внутри эмулирующей среды, известной как виртуальная машина Java. Microsoft предложила свою альтернативу Java в виде ActiveX. ActiveX – в 1996 году Microsoft дала это название своим программным компонентам OCX (OLE Control Extension), причем последние представляют собой модификацию VBX или управляющих элементов Visual Basic. При включении в документы HTML компоненты ActiveX загружаются и выполняются на клиенте. В настоящее время ActiveX работают только в среде Windows. JavaScript – простой язык сценариев, созданный Netscape. Поначалу именовавшийся LiveScript, код JavaScript (никакого отношения к языку Java компании Sun он не имеет) включается в документы на HTML. Он конкурирует с VBScript производства Microsoft Карты - Это такие изображения, отдельные части которых связаны со ссылками и позволяют выполнять переходы

Cтруктура HTML- документа(основные разделы) Служебная информация информация об имени страницы Тело программы

Команды (тэги (tags)) Написание текста …. …. изменение размера шрифта, где N от 1 до 6 команда перевода строки новый абзац …. …. без изменения исходного текста горизонтальная линия, атрибуты: –Толщина линии Size = в пикселях –Цвет Сolor=код цвета или «цвет» –Длина Width=в пикселях или % от ширины экрана –Способ выравнивания Align=Left, Right, Center … … полужирный шрифт … … курсив подчёркивание выделение усиленное выделение … – … – отображает весь текст в одной строке, не обрывая её

Отступы и списки UL>…. отступ - возврат … нумерованный список элемент нумерованного или маркированного списка … начало (конец) маркированного списка

Таблицы … начало (конец) таблицы … начало (конец) заголовка таблицы … начало (конец) заголовка столбца или строки … начало (конец) строки … начало (конец) столбца

Основные атрибуты таблицы BORDER Данный атрибут используется в тэге TABLE. Если данный атрибут присутствует, граница таблицы прорисовывается для всех ячеек и для таблицы вцелом. BORDER может принимать числовое значение, определяющее ширину границы, например BORDER=3. Данный атрибут используется в тэге TABLE. Если данный атрибут присутствует, граница таблицы прорисовывается для всех ячеек и для таблицы вцелом. BORDER может принимать числовое значение, определяющее ширину границы, например BORDER=3. ALIGN Если атрибут ALIGN присутствует внутри тэгов и, то он определяет положение подписи для таблицы (сверху или снизу). По умолчанию ALIGN=top. Если атрибут ALIGN встречается внутри, или, он управляет положением данных в ячейках по горизонтали. Может принимать значения left (слева), right (справа) или center (по центру). VALIGN Данный атрибут встречается внутри тэгов, и. Он определяет вертикальное размещение данных в ячейках. Может принимать значения top (вверху), bottom (внизу), middle (по середине) и baseline (все ячейки строки прижаты кверху). Данный атрибут встречается внутри тэгов, и. Он определяет вертикальное размещение данных в ячейках. Может принимать значения top (вверху), bottom (внизу), middle (по середине) и baseline (все ячейки строки прижаты кверху). NOWRAP Данный атрибут говорит о том, что данные в ячейке не могут логически разбиваться на несколько строк и должны быть представлены одной строкой. Данный атрибут говорит о том, что данные в ячейке не могут логически разбиваться на несколько строк и должны быть представлены одной строкой. COLSPAN Указывает, какое количество ячеек будет объединено по горизонтали для указанной ячейки. По умолчании - 1. ROWSPAN Указывает, какое количество ячеек будет объединено по вертикали для указанной ячейки. По умолчании - 1. Указывает, какое количество ячеек будет объединено по вертикали для указанной ячейки. По умолчании - 1. COLSPEC Данный параметр позволяет задавать фиксированную ширину колонок либо в символах, либо в процентах, например COLSPEC="20%".

Вставка графических изображений вставка картинки из файла текст ссылка на другой HTML-документ или файл (звуковой или видеоклип текст ссылка на метку в текущем HTML- документе текст ссылка на метку в другом HTML-документе активный текст метка для двух указанных выше типов ссылок активный текст ссылка в виде графического изображения Вставка гипертекстовых ссылок

Атрибуты (использующиеся в тэге ) LINK = цвет определяет цвет ссылки, которой ещё не пользовались VLINK = цвет определяет цвет ссылки, на которой уже щёлкали ALINK = цвет определяет цвет ссылки в момент щелчка

Атрибуты LEFT ALIGN = RIGHT CENTER Позволяет выравнивать текст по левому, правому краю или по центру соответственно. Используется в тэгах,. Например:. LEFT CLEAR = RIGHT ALL Используется, чтобы установить в указанной точке обтекание текстом объекта слева, справа или без обтекания соответственно. Используется в тэге. BORDER = число в пикселах определяет рамку вокруг изображения. Используется тэгом. HSPACE = число в пикселах VSPACE = число в пикселах определяют горизонтальный и вертикальный отступы вокруг изображения. Используется тэгом.

Атрибуты шрифтов … увеличение шрифта текста относительно текущего SMALL>… уменьшение шрифта текста текст смена цвета текста … смена гарнитуры шрифта Например:. … задание размера шрифта в данной области, используется в середине строки, т.к. после окончания своего действия не разбивает строку Например:.

Обозначение цветов redteal (зеленовато-синий) green (зеленый)lime (известковый) blackfuchsia (ярко- малиновый) maroon (тёмно- красный) silver (серебристый) oliveblue navy (синий)gray aqua (морской волны)white purple (фиолетовый)yellow

Атрибуты тэгов для списков (маркированных и нумерованных DISC TYPE =CIRCLE SQUARE Позволяет задавать тип маркера в произвольном месте текста. Например: первый элемент списка второй элемент списка Text Form Audio Home DINGBAT =Folder Next Disc drive Previous Позволяет создавать специальные типографские символы- картинки в качестве маркеров в списках. Например: 1 1,2,3,... TYPE = A A,B,C,… a a,b,c,… I I,II,III,... Позволяет использовать в качестве маркеров цифры и буквы. Например: SKIP = значение Позволяет в середине нумерованного списка пропустить заданное число пунктов нумерации. Например: – пропустит четыре следующих пункта. START = значение - Используется для указания того, с какого места в заданном типе нумерации начать нумерованный список. Например: – нумерация будет начинаться сбуквы E и будет продолжаться далее по алфавиту.

Атрибуты тэгов для создания таблиц BORDER = ширина границы Позволяет задавать ширину внешней границы таблицы в пикселах или в %.Например: CELLSPACING = ширина границы Позволяет задавать ширину фронтальной грани таблицы в пикселах или в %. Например: CELLPADDING = ширина Позволяет задавать ширину пустого пространства между содержимым ячейки и её границами.Например: COLSPAN = количество ячеекПозволяет растягивать строку на заданное количество ячеек (как бы объединять их). Например: ROWSPAN = количество строкПозволяет растягивать ячейку на заданное количество строк. Например:

Бегущая строка Используется для создания бегущей строки. TOP ALIGN = MIDDLE BOTTOM Позволяет разместить текст в верхней, средней или нижней части области бегущей строки SCROLL BEHAVIOR = LIDE ALTERNATE Используется, чтобы установить режим вывода строки прокрутка циклическая выход и остановка прыжки BGCOLOR = название цветаИспользуется для определения цвета фона бегущей строки DIRECTION = LEFT RIGHT Используется для определения направления бегущей строки n LOOP = INFINITE Используется для определения повторений бегущей строки текст пробегает по экрану n раз бесконечно (по умолчанию)

WIDTH = в пикселах или в % от высоты экрана Позволяет сделать область бегущей строки длиннее или короче HEIGHT = высота бегущей строки в пикселах или в % от высоты экрана Позволяет сделать область бегущей строки толще или тоньше. HSPACE = ширина в пикселях левого и правого полей между областью бегущей строки и окружающим её текстом или графикой. VSPACE = размер отступа в пикселях сверху и снизу от бегущей строки до текста или графики SCROLLAMOUNT = скорость перемещения текста [1…3000] … мигание объекта

Атрибуты изменение фона BGCOLOR = цвет Позволяет изменить фоновый цвет станицы, используется тэгом. Например: BACKGROUND = имя файла Позволяет использовать в качестве фона изображение из файла. BGPROPERTIES = FIXED Позволяет создать «водяной знак» (фон, который не перемещается вместе с текстом). Например:

Кадры (frames) (позволяют разбивать страницу на независимые окна) … Позволяет задавать кадровую структуру (страница с кадровой структурой не содержит тэга ). Позволяет определить отдельный кадр.

Атрибуты ROWS = ширина части,… Позволяет определить число и размер строк. Например: COLS = ширина части,...Позволяет определить число и размер столбцов. Например: SRC = имя файлаПозволяет вставить картинку или страницу в кадр. Например: YES SCROLLING = NO AUTO Позволяет задать линейки прокрутки MARGINWIDTH = значение MARGINHIGHT = значение Позволяет задать внутреннюю границу кадра

Атрибуты рамки кадрa BORDER = число YES FRAMEBORDER = NO BORDERCOLOR = цвет NAME = имяПозволяет задать имя кадра. Например: - -имя кадра -blank TARGET = -self -parent -top Используется для ссылок в кадр загружает указанный файл в кадр загружает файл в окно без названия загружает в окно, откуда сделан вызов в старший кадр в новое окно, разрушая страницу кадров Например: ТЕКСТ NORESIZEЗапрещает изменение кадровой структуры

Подключение звукового файла n LOOP = INFINITE Например: Подключение видеофайла n LOOP = INFINITE

Карты … Позволяет определить карту. Внутри него определяются области карты при помощи элементов AREA и задаётся имя карты при помощи атрибута name. name=имя Для каждой области карты должен быть создан свой элемент AREA, который должен включать атрибут, определяющий ссылку: HREF=адрес ссылки

Атрибуты, определяющие форму области на карте rect (x,y)(x1,y1) Shape = poly (x,y)(x1,y1)... circle (x,y),r point(x,y) Coords =,,,,… usemapопределяет имя карты; это имя ставится в соответствии со значением соответствующих атрибутов, которые определяют карту usemap = #имя altатрибут для задания текста, заменяющего изображение карты, не является обязательным alt = Текст подсказки

Например: