Заглавная страница Избранные статьи Случайная статья Познавательные статьи Новые добавления Обратная связь КАТЕГОРИИ: АрхеологияБиология Генетика География Информатика История Логика Маркетинг Математика Менеджмент Механика Педагогика Религия Социология Технологии Физика Философия Финансы Химия Экология ТОП 10 на сайте Приготовление дезинфицирующих растворов различной концентрацииТехника нижней прямой подачи мяча. Франко-прусская война (причины и последствия) Организация работы процедурного кабинета Смысловое и механическое запоминание, их место и роль в усвоении знаний Коммуникативные барьеры и пути их преодоления Обработка изделий медицинского назначения многократного применения Образцы текста публицистического стиля Четыре типа изменения баланса Задачи с ответами для Всероссийской олимпиады по праву Мы поможем в написании ваших работ! ЗНАЕТЕ ЛИ ВЫ?
Влияние общества на человека
Приготовление дезинфицирующих растворов различной концентрации Практические работы по географии для 6 класса Организация работы процедурного кабинета Изменения в неживой природе осенью Уборка процедурного кабинета Сольфеджио. Все правила по сольфеджио Балочные системы. Определение реакций опор и моментов защемления |
Язык гипертекстовой разметки HTML (hypertext Markup Language) – декларативный язык, используемый для публикации и обмена документами в internet.Стр 1 из 2Следующая ⇒
План 1. Язык гипертекстовой разметки HTML 2. Каскадные таблицы стилей CSS 3. Язык XML Язык гипертекстовой разметки HTML (Hypertext Markup Language) – декларативный язык, используемый для публикации и обмена документами в Internet. Язык гипертекстовой разметки HTML Разработку языка HTML в 1989 году начал Тим Бернерс Ли, сотрудник Европейского центра ядерных исследований (CERN).
Первоначальная идея заключалась в том, чтобы при помощи гипертекстовой навигационной системы объединить все множество информационных ресурсов CERN в единую информационную систему.
Благодаря своей простоте, язык HTML вскоре завоевал мировую популярность и стал основным средством для публикации документов в Internet. С начала 1990-х гг. различные производители программного обеспечения использовали многочисленные диалекты HTML.
Для стандартизации HTML была создана организация World Wide Web Consortium (W3C), которая разработала несколько спецификаций.
В настоящий момент действует спецификация HTML 4.01, утвержденная в 1999 году, и ведется разработка спецификации HTML 5. Организация Web-ориентированной системы Web-ориентированная информационная система предполагает наличие двух типов приложений:
Клиентское приложение (Web-браузер)
Серверное приложение (Web-сервер) Основные понятия языка HTML тэг элемент атрибут Каждый тэг записывается в угловых скобках "<", ">". Различают открывающие тэги (обозначают начало элемента) и закрывающие тэги (обозначают конец элемента). Текст закрывающего тэга начинается со знака слэш "/"
Пример. <P> </P> Элемент состоит из
Браузеры по-разному отображают содержимое элементов, в зависимости от их имен
Пример. <H1>Заголовок текста</H1> <P>Первый абзац текста</P> В документах могут использоваться пустые элементы, в которых отсутствует содержимое, а также элементы, которые состоят только из открывающего тэга – одиночные тэги Пример. <DIV></DIV> <HR> Элементы могут быть вложены один в другой. При этом нужно следить за правильным порядком открывающих и закрывающих тэгов: тот элемент, который раньше был начат, должен быть закрыт позже Пример. <P>Абзац с <U>подчеркнутым текстом</U></P> <P>Абзац с <U>подчеркнутым текстом</P></U> Атрибуты представляют собой пару вида имя="значение" и записываются в открывающих тэгах через пробел после имени тэга
Пример. <IMG src="MyPhoto.jpeg" height="100" width="75"> Структура HTML-документа <!–- пролог HTML-документа --> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <!–- заголовок HTML-документа --> </HEAD> <BODY> <!–- основное содержимое HTML-документа --> </BODY> </HTML> В прологе HTML-документа указывается версия языка HTML, использованная при оформлении документа
HTML-документ состоит из двух частей – заголовка и основного содержимого, – размещенных внутри элемента HTML. В заголовке HTML-документа (элемент HEAD) указывается служебная информация, используемая при обработке документа, например:
<TITLE>Пример HTML-документа</TITLE> <META http-equiv="Content-Type" content="text/html; charset=windows-1251"> <META name="Author" content="Иванов И.И."> Основное содержимое HTML-документа размещается внутри элемента BODY. Все содержимое должно быть разбито на блоки.
В качестве блоков могут выступать не только такие простые элементы, как абзацы и заголовки, но и более сложные конструкции – списки, таблицы и т.д., которые в свою очередь состоят из нескольких блоков.
В любом месте HTML-документа могут встречаться комментарии, которые ограничиваются последовательностями символов “<!--” и “-->”.
<P>Это обыкновенный <!-- это комментарий -->текст</P>
Содержимое комментариев игнорируется браузером и на экране не отображается. Элементы, описывающие логическую структуру HTML-документа Абзацы:
P – обыкновенный абзац H1 – абзац-заголовок 1-го уровня ... H6 – абзац-заголовок 6-го уровня Пример. <H1>Язык HTML</H1> <H2>§1. Структура HTML-документа</H2> <P>Внешне HTML-документ является обыкновенным текстовым документом.</P> Язык HTML позволяет описывать три вида списков:
– ненумерованные (маркированные) списки
– нумерованные (упорядоченные) списки
– списки определений (элементы DL, DT, DD). Пример. Ненумерованный список
<UL> <LI>ненумерованные списки (элементы UL, LI);</LI> <LI>нумерованные списки (элементы OL, LI);</LI> <LI>списки определений (элементы DL, DT, DD).</LI> </UL> Пример. Нумерованный список
<OL> <LI>ненумерованные списки (элементы UL, LI);</LI> <LI>нумерованные списки (элементы OL, LI);</LI> <LI>списки определений (элементы DL, DT, DD).</LI> </OL> Пример. Список определений <DL> <DT>тэг</DT> <DD>метка, используемая для описания логического или физического форматирования HTML-документа.</DD> <DT>элемент</DT> <DD>фрагмент HTML-документа, на который распространяется действие тэга</DD> <DT>атрибут</DT> <DD>параметр, уточняющий тэг</DD> </DL> Для описания структуры таблиц используются элементы:
TABLE TR TD TH Пример. Простая таблица <TABLE> <TR> <TH>Столбец 1</TH> <TH>Столбец 2</TH> </TR> <TR> <TD>Первая строка, столбец 1</TD> <TD>Первая строка, столбец 2</TD> </TR> <TR> <TD>Вторая строка, столбец 1</TD> <TD>Вторая строка, столбец 2</TD> </TR> </TABLE> Гипертекстовая ссылка В качестве гиперссылки может использоваться любой элемент гипертекстового документа: текст, изображение и т.п.
При отображении гипертекстового документа гиперссылки обычно выделяются.
Посещенные пользователем гиперссылки обычно выделяются другим цветом. Для создания гиперссылки используется элемент A с атрибутом href:
<A href="URL документа">содержимое ссылки</A> Конкретное место гипертекстового документа, к которому должен осуществляться переход, должно помечаться с помощью "закладки":
<A name="имя закладки"></A> В гипертекстовых ссылках требуется указывать адрес документа (фрагмента документа) с помощью URL (Uniform Resource Locator, универсальный указатель ресурсов).
Основные компоненты URL: http://program.vsu/news/index.php#01.09.2009 протокол имя сервера каталог имя документа имя закладки Некоторые компоненты в URL ссылки могут отсутствовать. В этом случае их значение определяется на основании URL текущего документа, например:
href="#begin"
href="file.html" href="../file.html" href="http://program.vsu" Примеры. 1. Ссылка на другой документ в текущем каталоге <P>Просмотрите <A href="example2.html"> 2. Ссылка на другой сервер <P>Зайдите на <A href="http://program.vsu"> 3. Графическая ссылка <A href="http://www.vsu.by"> 4. Cсылка на закладку <P><A href="#begin">в начало</A></P> DIV – элемент уровня блока <DIV class="ramochka"> <P> Несколько </P> <P> абзацев </P> <P> в рамочке </P> </DIV> Свойства шрифта color font-family font-size font-style font-weight text-decoration Свойства абзаца text-align text-indent margin-left margin-right margin-top margin-bottom line-height При указании числовых значений свойств (размер шрифта, отступы, межстрочный интервал) обязательно следует указывать, в каких единицах они заданы: % – проценты Единица измерения записывается после числа без пробела: 100px, 14pt, 50% Границы блока border-color border-width border-style Фон background-color background-image background-repeat background-position Пример.
BODY { background-color: #AAFFAA; background-image: url(spring.jpg); background-repeat: repeat-y; margin-left: 60px; }
<BODY> <H2>Стихи</H2> <P>...</P> </BODY>
Язык XML
XML (eXtensible Markup Language)
XML является подмножеством языка SGML (Standard Generalized Markup Language).
XML был разработан World Wide Web Consortium (W3C) в 1996 году для представления и передачи данных в Интернет. При разработке языка XML преследовались цели:
– XML-документы должны быть удобны для чтения и достаточно понятны.
– Подготовка XML-документа должна осуществляться быстро на основе простой, формальной и точной процедуры.
– Программы-обработчики XML-документов должны быть просты в написании. Преимущества языка XML 1. Позволяет легко структурировать данные Обычный текстовый документ Иванов Иван Иванович 1234 Петров Петр Петрович 9876 Сидоров Сидор Сидорович 5555
XML-документ <group> <student> <lastname>Иванов</lastname> <firstname>Иван</firstname> <middlename>Иванович</middlename> <studentcard>1234</studentcard> </student> ... 2. Позволяет создавать документы любой структуры и гарантирует её однозначность.
3. Независим от программно-аппаратной платформы и позволяет обмениваться информацией несовместимым между собой системам.
4. XML-документы могут создаваться "вручную" и программно.
5. Поддержка XML реализована во всех современных технологиях разработки: C++, C#, Java, JavaScript, Недостатки языка XML
• избыточность текстового представления информации • более сложная обработка, по сравнению с двоичными файлами • отсутствие встроенной поддержки типов данных • трудность представления не иерархических типов данных Состав XML-документа
• Пролог • Инструкции по обработке • Комментарии • Элементы • Атрибуты Пролог (декларация) XML-документа включает в себя информацию относящуюся ко всему документу: кодировку, описание структуры документа и т.п.
В прологе XML-документа обязательно должна быть указана используемая версия языка XML и его тип:
<?xml version="1.0" encoding="windows-1251"?> <!DOCTYPE example SYSTEM "example.dtd"> <!-- пример пролога XML-документа --> Инструкции по обработке XML-документа содержат указание по обработке документа и ограничиваются знаками <? и ?>.
Комментарии должны ограничиваться знаками <!-- и -->.
Каждый элемент XML-документа состоит из открывающего и закрывающего тега, а также всего, что находится между ними. Элементы должны быть правильно вложены друг в друга.
<group> <student> <lastname>Иванов</lastname> <firstname>Иван</firstname> <middlename>Иванович</middlename> <studentcard>1234</studentcard> </student> <!--... --> </group> В каждом открывающем тэге могут указываться атрибуты, значения которых обязательно должны быть заключены в кавычки:
<group count="18"> <!--... --> </group> Внутреннее содержимое элементов может отсутствовать. В этом случае закрывающий тэг не используют, а специальным образом отмечают открывающий:
<ellipse cx="144.166" cy="180.166" rx="44" ry="53.833"/> XML-документ должен содержать единственный корневой элемент, имя которого указывается в прологе (внутри DOCTYPE):
<?xml version="1.0"?> <!DOCTYPE svg... > <svg...> ... </svg> Внутри элементов могут быть использованы почти все текстовые символы, за исключением специальных:
< < > > & & ' ' " " XML-документ, соответствующий формальным правилам, называется well-formed (правильно оформленный). Для контроля структуры XML-документа используются специальные описания.
Наиболее распространены описания в формате DTD (Document Type Definitions). Пример. Фрагмент DTD-описания языка HTML.
<!ELEMENT TABLE - - (CAPTION?, (COL*|COLGROUP*), THEAD?, TFOOT?, TBODY+)> <!ELEMENT CAPTION - - (%inline;)* -- table caption --> <!ELEMENT THEAD - O (TR)+ -- table header --> <!ELEMENT TFOOT - O (TR)+ -- table footer --> <!ELEMENT TBODY O O (TR)+ -- table body --> <!ELEMENT COLGROUP - O (COL)* -- table column group --> <!ELEMENT COL - O EMPTY -- table column --> <!ELEMENT TR - O (TH|TD)+ -- table row --> <!ELEMENT (TH|TD) - O (%flow;)* -- table header cell, table data cell--> DTD-описание может располагаться в трех местах:
• Внутри XML-документа: • В локальном файле: • В общедоступном Интернет-файле: Общий вид описания элемента:
<!ELEMENT ИмяЭлемента (содержимое)>
При описании элемента необходимо перечислить вложенные в него элементы и порядок их следования, пусто 1 ? 0.. 1 Пример.
<!ELEMENT group (student*)> <!ELEMENT student (lastname,firstname,middlename,studentcard)> Вместо содержимого элемента могут быть указаны
#CDATA
#PCDATA
EMPTY ANY Пример.
<!ELEMENT lastname (#PCDATA)> <!ELEMENT firsname (#PCDATA)> <!ELEMENT middlename (#PCDATA)> <!ELEMENT studentcard (#PCDATA)> Общий вид описания атрибутов элемента:
<!ATTLIST ИмяЭлемента
Пример.
<!ELEMENT IMG EMPTY -- Embedded image --> <!ATTLIST IMG %attrs; -- %coreattrs, %i18n, %events -- src %URI; #REQUIRED -- URI of image to embed -- alt %Text; #REQUIRED -- short description -- longdesc %URI; #IMPLIED -- link to long description (complements alt) -- Пример 1. Описание атрибута <!ATTLIST group Count CDATA #IMPLIED > Использование атрибута <group> или <group count="18"> <!--... --> <!--... --> </group> </group> Пример 2. Описание атрибута <!ATTLIST student sex (male|female) #REQUIRED > Использование атрибута <student sex="male"> или <student sex="female"> <!--... --> <!--... --> </student> </student> Внутри DTD-описания также могут быть заданы значения для сущностей (подстановок), которые могут использоваться внутри DTD-описания:
<!ENTITY % Имя "значение"> или внутри XML-документа:
<!ENTITY Имя "значение"> Пример 1. Описание сущности <!ENTITY % user "lastname,firstname,middlename"> Использование сущности <!ELEMENT student (%user;,studentcard)> <!ELEMENT teacher (%user;,discipline)> Пример 2. Описание сущности <!ENTITY University Использование сущности <organization>&University;</organization> Анализ XML-файлов Для ввода информации из XML-файлов используются специальные XML-анализаторы.
Существует несколько видов XML-анализаторов, которые отличаются принципами своей работы: Создание XML-документов Для создания XML-документов можно использовать класс XMLStreamWriter.
Данный класс позволяет избавиться от рутинных операций, автоматически обеспечивает соответствие получаемого документа синтаксису языка XML, обеспечивает корректную вложенность тэгов. If (student.getSex()) xmlStreamWriter.writeAttribute("sex","male"); else xmlStreamWriter.writeAttribute("sex","female"); xmlStreamWriter.writeStartElement("lastName"); xmlStreamWriter.writeCharacters(student.getLastName()); xmlStreamWriter.writeEndElement(); //... xmlStreamWriter.writeEndElement(); // для "student" } xmlStreamWriter.writeEndElement(); // для "group" План 1. Язык гипертекстовой разметки HTML 2. Каскадные таблицы стилей CSS 3. Язык XML Язык гипертекстовой разметки HTML (Hypertext Markup Language) – декларативный язык, используемый для публикации и обмена документами в Internet.
|
|||||||||
Последнее изменение этой страницы: 2016-08-01; просмотров: 221; Нарушение авторского права страницы; Мы поможем в написании вашей работы! infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 18.119.111.9 (0.231 с.) |