Структуры данных, НТМL

Содержание

Слайд 2

Метаязык для описания структур данных
(Бэкуса-Наура формы (БНФ))

Символ «: : =» означает «может

Метаязык для описания структур данных (Бэкуса-Наура формы (БНФ)) Символ «: : =»
быть выражено как», «это есть».
Каждое правило заканчивается точкой.

Описание структуры данных представляет собой список правил, каждое из которой включает левую и правую части отделяемых символом:
«: : =».

Слайд 3

Все элементы данных (ЭД) делятся на элементарные(терминальные) и неэлементарные (нетерминальные).
Структура нетерминальные ЭД

Все элементы данных (ЭД) делятся на элементарные(терминальные) и неэлементарные (нетерминальные). Структура нетерминальные
определяется с помощью структур других ЭД при использовании правил.
Нетерминальный символ всегда располагается в левой части правила и он всегда единственный.
В правой части правила располагаются элементы данных,
которые определяют структуру нетерминального символа,
расположенного в левой части.

Слайд 4

Неэлементарные категории (понятия) языка (неатомарные элементы данных, не терминалы) заключены в скобки

Неэлементарные категории (понятия) языка (неатомарные элементы данных, не терминалы) заключены в скобки

“<” и “>”.
Названия нетерминальных символов обозначаются словами, выражающими их интуитивный смысл и написанными на естественном языке.
Терминальные символы изображаются буквами алфавита или цепочками знаков, заключенными в кавычки
(при неоднозначности в обозначениях).

Обозначение элементов данных

Слайд 5

Ноль есть цифра, единица есть цифра, …, девять есть цифра:

<Цифра >::=«0».
<Цифра >::=«1».
…..
<Цифра

Ноль есть цифра, единица есть цифра, …, девять есть цифра: ::=«0». ::=«1».
>::=«9».

Определение цифры

Цифра::= 0.
Цифра::=1.
…..
Цифра::=9.

Слайд 6

Символ «|» означает разделительное или:
Цифра :: = 0| 1| 2| 3| 4|

Символ «|» означает разделительное или: Цифра :: = 0| 1| 2| 3|
5| 6| 7| 8|9.
Символ «[ ]» означает необязательность синтаксической категории:
Целое число::=[Знак числа] Последовательность цифр

Альтернативы при описании структур данных, необязательность элементов

Слайд 7

Символы «{}» означают многократное повторение, возможно и ноль раз
({}mn - многократное повторение,

Символы «{}» означают многократное повторение, возможно и ноль раз ({}mn - многократное
не менее m раз, но не более чем n раз):
Целое неотрицательное число не превышающее 999 ::= ::= {Цифра}13 .
Символы: ( ) означают группировку :
Целое одноразрядное число ::=
::= (+Цифра) | (-Цифра )|Цифра.

Символы повторения и группировки

Слайд 8

Число с фиксированной точкой
:: =[+|-]{Цифра}1 [. {Цифра}1]

Целое число с фиксированной точкой
:: =[+|-]{

Число с фиксированной точкой :: =[+|-]{Цифра}1 [. {Цифра}1] Целое число с фиксированной
Цифра }1
Основание системы счисления:
: =(2| 3| 4| 5| 6| 7| 8|9) |
(Цифра не ноль |{Цифра}1)

Абсолютный порядок : = Целое число с фиксированной точкой

Примеры правил записи чисел

Слайд 9

Число плавающей точкой
::==Число с фиксированной точкой ×Основание системы счисления Абсолютный порядок


Пример

Число плавающей точкой ::==Число с фиксированной точкой ×Основание системы счисления Абсолютный порядок
отсутствия возможности использования метаязыка
для задания структуры записи

Пример записи числа: 23,45×1012

Слайд 10

HTML - Hyper Text Markup Language –
«язык гипертекстовой разметки»
-

HTML - Hyper Text Markup Language – «язык гипертекстовой разметки» - стандартизированный
стандартизированный язык разметки текстов.
Язык HTML был разработан британским учёным Тимом Берненсом-Ли
приблизительно в 1986 -1991 г. в Женеве.

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

Слайд 11

Текстовые документы, содержащие разметку на языке HTML
(такие документы традиционно имеют расширение .html или .htm),

Текстовые документы, содержащие разметку на языке HTML (такие документы традиционно имеют расширение

обрабатываются специальными приложениями,
которые отображают документ
в его форматированном виде.
Такие приложения, называемые «браузерами»
или «интернет-обозревателями»,
обычно предоставляют пользователю удобный интерфейс для запроса  вебстраниц, их просмотра
(и вывода на иные внешние устройства)
и, при необходимости, отправки данных.
(Google Chrome(Google Chrome, Mozilla Firefox(Google Chrome, Mozilla Firefox, Opera(Google Chrome, Mozilla Firefox, Opera, Internet Explorer ).

Слайд 12

С помощью HTML
можно легко
описать структуру и содержание относительно простого документа.
Текст

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

Слайд 13

Любой текстовый документ на языке HTML представляет собой набор элементов
причём начало

Любой текстовый документ на языке HTML представляет собой набор элементов причём начало
и конец каждого элемента обозначается специальными пометками — тегами.
Теги записываются в треугольных скобках (< >).
Теги - управляющие символы.
При воспроизведении текста
указывают на то, чтобы произвести
определенные действия с текстом.
На экран теги не выводятся.

Структура текстового документа

Слайд 14

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

Задает полужирное

Объявляет тип документа и предоставляет основную информацию язык и версия языка: Задает
начертание отрывка текста.

Представляет тело документа.

Перенос текста на новую строку.
Выделяет отрывок текста курсивом.

Параграфы в тексте.
Заголовок HTML-документа.
<br><p>Некоторые теги:<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide15" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/1169673/slide-14.jpg" target="_blank" rel="noopener">Слайд 15</a><h3 class="slides-content text-center font-bold"><div><p>Элементы, находящиеся внутри тега <br><html>, <br>образуют дерево документа, <br>так называемую объектную модель</div></h3></h3><img onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt="Элементы, находящиеся внутри тега , образуют дерево документа, так называемую объектную модель" loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/1169673/slide-14.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/1169673/slide-14.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/1169673/slide-14.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-14.jpg 1440w" src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-14.jpg" class="slides-image"><!----><div class="slides-content">документа, <br>DOM (document object model). <br>При этом элемент тега<br><html> <br>называют корневым элементом.<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide16" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/1169673/slide-15.jpg" target="_blank" rel="noopener">Слайд 16</a><h3 class="slides-content text-center font-bold"><div><p>Пример дерева документа<br></div></h3></h3><img onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt="Пример дерева документа" loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/1169673/slide-15.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/1169673/slide-15.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/1169673/slide-15.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-15.jpg 1440w" src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-15.jpg" class="slides-image"><!----><!----><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide17" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/1169673/slide-16.jpg" target="_blank" rel="noopener">Слайд 17</a><h3 class="slides-content text-center font-bold"><div><p>Документ ::= <!DOCTYPE html><br><html> Объектная модель документа </html>.<br>Объектная модель документа ::=Заголовок Тело.<br></div></h3></h3><img onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt="Документ ::= Объектная модель документа . Объектная модель документа ::=Заголовок Тело." loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/1169673/slide-16.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/1169673/slide-16.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/1169673/slide-16.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-16.jpg 1440w" src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-16.jpg" class="slides-image"><!----><!----><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide18" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/1169673/slide-17.jpg" target="_blank" rel="noopener">Слайд 18</a><h3 class="slides-content text-center font-bold"><div>Заголовок ::=<head> Содержание заголовка </head><br>Тело::=<body> Содержание документа</body> .<br>Содержание документа::=<br>::={Элемент}1.<br>Элемент::=<br>::=Текст| Открывающий тег [Элемент</div></h3></h3><img onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt="Заголовок ::= Содержание заголовка Тело::= Содержание документа . Содержание документа::= ::={Элемент}1. Элемент::=" loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/1169673/slide-17.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/1169673/slide-17.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/1169673/slide-17.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-17.jpg 1440w" src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-17.jpg" class="slides-image"><!----><div class="slides-content">Закрывающий тег].<br><p>Структура заголовка и содержания документа<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide19" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/1169673/slide-18.jpg" target="_blank" rel="noopener">Слайд 19</a><h3 class="slides-content text-center font-bold"><div><p>Каждому открывающему тегу <…> <br>соответствует закрывающий </…>. <br>Открывающий и закрывающий теги <br>содержат</div></h3></h3><img onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt="Каждому открывающему тегу соответствует закрывающий . Открывающий и закрывающий теги содержат имя" loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/1169673/slide-18.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/1169673/slide-18.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/1169673/slide-18.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-18.jpg 1440w" src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/1169673/slide-18.jpg" class="slides-image"><!----><div class="slides-content">имя тега. <br>Но теги могут быть пустыми, <br>то есть не содержащими никакого текста и других элементов. <br>В этом случае закрывающий тег не указывается. Например, тег переноса строки <br> - одиночный <br>и закрывать его не нужно. <br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide20" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/1169673/slide-19.jpg" target="_blank" rel="noopener">Слайд 20</a><h3 class="slides-content text-center font-bold"><div><p><html><br><head> <title>Моя первая страничка

Привет, друзья!
Я студент КАИ, это моя первая страничка!


Пример

Моя первая страничка Привет, друзья! Я студент КАИ, это моя первая страничка! Пример структуры текста
структуры текста

Слайд 21

Этот текст будет полужирным, а этот — ещё и курсивным.



Этот текст будет полужирным, а этот — ещё и курсивным. HTML Document

HTML Document



Этот текст будет полужирным, а этот — ещё и курсивным.




Пример описания структуры текста:

Имя файла: Структуры-данных,-НТМL.pptx
Количество просмотров: 25
Количество скачиваний: 0