HTML. Язык гипертекстовой разметки презентация

История HTML
HTML 1.0 – 1989 г.
HTML 2.0 – 1991 г.
HTML 3.0 – 1995 г.
HTML 4.0 – 1998 г. , HTML 4.01 –1999 г.
HTML 5.0 – не утвержден по сей день

Браузеры должны знать какой стандарт HTML вы используете!!!
Переходная версия к HTML 4.01

Браузеры должны знать какой стандарт HTML вы используете!!!
Строгая версия HTML 4.01

Браузеры должны знать какой стандарт HTML вы используете!!!
Для HTML 5.0 достаточно:
Он прощает все!!!
http://validator.w3.org/
проверка кода на валидность и соотвествие стандартам

Основные понятия
Теги (от англ. «tag»-отметка)- операторы и команды HTML.
Все теги заключаются в
< >.
Следует заметить, что практически все теги надо закрывать:
Теги web-страницы
В закрывающем теге ставится /

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

Структура документа
Любая web-страница задается следующими тэгами:
Site name
Содержимое страницы

Структура документа

Голова документа.
Заголовок документа
- стандарт HTML 5
применяется для определения стилей элементов веб-страницы.

Тело документа.
Предназначен для хранения содержания веб-страницы (контента),отображаемого в окне браузера.
Информацию, которую следует выводить в документе, следует располагать именно внутри контейнера

Тело документа
Атрибуты тега
Alink -Устанавливает цвет активной ссылки.
Background - Задает фоновый рисунок на веб-странице.
Bgcolor - Цвет фона веб-страницы.
Bgproperties - Определяет, прокручивать фон совместно с текстом или нет.
Bottommargin - Отступ от нижнего края окна браузера до контента.
Leftmargin - Отступ по горизонтали от левого края окна браузера до контента.
Link - Цвет ссылок на веб-странице.
Rightmargin - Отступ от правого края окна браузера до контента.
Scroll - Устанавливает, отображать полосы прокрутки или нет.
Text - Цвет текста в документе.
Topmargin -Отступ от верхнего края окна браузера до контента.
Vlink - Цвет посещенных ссылок.

Теги форматирования текста
,...,
- HTML предлагает шесть заголовков разного уровня, которые показывают относительную важность секции, расположенной после заголовка.
Устанавливает жирное начертание шрифта.
Предназначен для акцентирования текста. Браузеры отображают такой текст жирным начертанием.
Предназначен для акцентирования текста. Браузеры отображают такой текст курсивным начертанием.
Устанавливает курсивное начертание шрифта.
Используется для выделения в тексте цитат.
Предназначен для выделения длинных цитат внутри документа.
устанавливает перевод строки в том месте, где этот тег находится.
Определяет текстовый абзац.
Является блочным элементом и предназначен для выделения фрагмента документа с целью изменения вида содержимого. Как правило, вид блока управляется с помощью стилей.

Гиперссылки
Тег
:
href=“путь” – связь с объектом, на который идет ссылка
target=“название” – указание того
окна, где будет открываться объект:
_blank - Загружает страницу в новое окно браузера.
_self -Загружает страницу в текущее окно.
_parent -Загружает страницу во фрейм-родитель, если фреймов нет, то это значение работает как _self.
_top -Отменяет все фреймы и загружает страницу в полном окне браузера, если фреймов нет, то это значение работает как _self.
Пример:
Link
Link
Link

«Якоря»
Якорь – специальная метка в документе, невидимый объект, на который можно создать ссылку.
Вставка якоря:
Ссылка на якорь:
текст
Ссылка на якорь на другой странице:
текст

Вставка изображений
Тег
:
Src=“путь” – привязка к объекту
Width=“число” – ширина
Height =“число” – длина
Border=“число” – толщина границ
Bordercolor=“#цвет” – цвет границ
Align=“значение”- расположение объекта:
Left
Right
Alt= Альтернативный текст для изображения.
Title = Название рисунка
Пример:
Слайд 17
Списки

Списки

Таблицы
Тег
:
Width=“число” – ширина
Height =“число” – длина
Border=“число” – толщина границ
Bordercolor=“#цвет”- цвет границ
Bgcolor=“#цвет” – фон
Cellspacing=“число”- расстояние между ячейками
Align=“значение”- центровка

Строки и ячейки.
Вставка строки – тег
Вставка ячейки – тег :
Width=“число” – ширина
Height =“число” – длина
Border=“число” – толщина границ
Bordercolor=“#цвет”- цвет границ
Bgcolor=“#цвет” – фон
Colspan=“число”- кол-во столбцов, которое занимает ячейка.
Rowspan = устанавливает число ячеек, которые должны быть объединены по вертикали.

Пример
text
text
text
text
text
text

Задание

Формы
Тег
устанавливает форму на веб-странице. Форма предназначена для обмена данными между пользователем и сервером. Область применения форм не ограничена отправкой данных на сервер, с помощью клиентских скриптов можно получить доступ к любому элементу формы, изменять его и применять по своему усмотрению.
Для отправки формы на сервер используется кнопка Submit, того же можно добиться, если нажать клавишу Enter в пределах формы. Если кнопка Submit отсутствует в форме, клавиша Enter имитирует ее использование.
Когда форма отправляется на сервер, управление данными передается программе, заданной атрибутом action тега. Предварительно браузер подготавливает информацию в виде пары «имя=значение», где имя определяется атрибутом name тега

Формы
Синтаксис -
...
Как по вашему мнению расшифровывается аббревиатура "ОС"?
Офицерский состав
value="a2">Операционная система
value="a3">Большой полосатый мух

Формы
Тег
является одним из разносторонних элементов формы и позволяет создавать разные элементы интерфейса и обеспечить взаимодействие с пользователем. Главным образом
предназначен для создания текстовых полей, различных кнопок, переключателей и флажков. Хотя элемент
не требуется помещать внутрь контейнера
, определяющего форму, но если введенные пользователем данные должны быть отправлены на сервер, где их обрабатывает серверная программа, то указывать обязательно. То же самое обстоит и в случае обработки данных с помощью клиентских приложений, например, скриптов на языке JavaScript.

Формы
Основной атрибут тега
, определяющий вид элемента — type. Он позволяет задавать следующие элементы формы: текстовое поле (text), поле с паролем (password), переключатель (radio), флажок (checkbox), скрытое поле (hidden), кнопка (button), кнопка для отправки формы (submit), кнопка для очистки формы (reset), поле для отправки файла (file) и кнопка с изображением (image). Для каждого элемента существует свой список атрибутов, которые определяют его вид и характеристики.
Ваше имя:
Каким браузером в основном пользуетесь:
Internet Explorer
Opera
Firefox
Комментарий

Формы

Стили внутри документа
Применяется для определения стилей элементов веб-страницы. Тег необходимо использовать внутри контейнера <head>. Можно</div></h3></h3><!----><!----><div class="slides-content">задавать более чем один тег
Тег STYLE
h1 { font-size: 120%; font-family: Verdana, Arial, Helvetica, sans-serif; color: #333366; }
Hello, world!

Это надо помнить!!!
Элемент : не выходите из дома без него.
Всегда начинайте свою страницу с оnределения DОСТУРЕ, а сразу за ним указывайте , который всегда должен быть корневым элементом вашей веб-страницы Итак, nосле DОСТУРЕ тег должен начинать вашу страницу, тег - заканчивать, а все остальное должно быть вложено в него.
Всегда используйте и
, чтобы НТМL-код
был лучше.
Только элементы и <Ьоdу> могут наnрямую быть вложены
в элемент . Это означает, что все остальные элементы
должны располагаться внутри элементов или
.
Все без исключения!

Это надо помнить!!!
Что такое без
?<br>В элементе <head> всегда помещайте элемент <title>.</div></h3></h3><!----><!----><div class="slides-content">Это<br>закон. Если вы этого не сделаете, то HTML будет признан<br>не соответствующим стандартам. Элемент <head> - единственный,<br>в который вы можете помещать элементы <title>, <meta> и <style>.<br>Наполняйте элемент <body> только полезными блочными<br>элементами.<br>Неnосредственно внутрь элемента <bоdу> вы можете помещать<br>только блочные элементы ( <hl>, <h2> ... <hб>, <р>, <blocltquote><br>и т. д.). Строчные элементы и текст необходимо сначала поместить<br>в другой блочный элемент, и только затем они смогут войти<br>в состав элемента <bоdу>.<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide30" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/397649/slide-29.jpg" target="_blank" rel="noopener">Слайд 30</a><h3 class="slides-content text-center font-bold"><div><p>Это надо помнить!!!<br><p>Никогда не помещайте блочные элементы внутрь строчных.<br>Внутрь строчных элементов вы можете</div></h3></h3><!----><!----><div class="slides-content">помещать только другие<br>строчные элементы или текст. Блочные элементы не могут входить<br>внутрь строчных ни при каких обстоятельствах.<br>Не помещайте блочные элементы внутрь элемента <р>.<br>Абзацы предназначены для текста, поэтому не нужно помещать<br>в них блочные элементы. Но, конечно же, любые строчные элементы<br>можно использовать внутри абзацев (<em>, <а>, <strong>, <imq>,<br><q> и т. д.).<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide31" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/397649/slide-30.jpg" target="_blank" rel="noopener">Слайд 31</a><h3 class="slides-content text-center font-bold"><div><p>Это надо помнить!!!<br><p>Списки предназначены для перечисления пунктов.<br>Внутри элементов <ul> и <ol> разрешается использовать</div></h3></h3><!----><!----><div class="slides-content">только<br>элемент <li>. Но зачем вам помещать в упорядоченный или неупо рядоченный список что-то, кроме его пунктов?<br>Продолжим. Помещайте любые элементы внутрь<br>элементов сnиска.<br>Внутрь элементов списка <li> вы можете помещать любой текст, а также строчные или блочные элементы .<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide32" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/397649/slide-31.jpg" target="_blank" rel="noopener">Слайд 32</a><h3 class="slides-content text-center font-bold"><div><p>Это надо помнить!!!<br><p>Кто бы мог подумать? Элемент <blockquote> любит<br>только блочные элементы.<br>Элемент <blockquote> требует,</div></h3></h3><!----><!----><div class="slides-content">чтобы внутри его было не менее одного блочного элемента. Пожалуйста, всегда помещайте ваш текст и другие строчные элементы в блочные элементы и уже эти блочные элементы добавляйте в <blockquote>.<br>Будьте внимательны, когда вкладываете строчные<br>элементы друг в друга.<br>Несмотря на то что вы можете успешно вкладывать некоторые<br>строчные элементы друг в друга, все же есть несколько случаев,<br>в которых это действие нелогично и бессмысленно . Никогда не<br>вкладывайте элемент <а> внутрь другого элемента <а>, потому что<br>это может очень сильно запутать пользователей . И еще , не предусмотрено способа вкладывать строчные элементы в такие пустые элементы , как <img>.<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide33" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/397649/slide-32.jpg" target="_blank" rel="noopener">Слайд 33</a><h3 class="slides-content text-center font-bold"><div><p>HTML 5!!!<br><p>HTML 5 — это не продолжатель языка разметки гипертекста, а новая открытая</div></h3></h3><!----><!----><div class="slides-content">платформа, предназначенная для создания веб-приложений использующих аудио, видео, графику, анимацию и многое другое.<br>Ура, новые теги, облегчающие жизнь!!!<br><article> <aside> <audio> <canvas> <command> <datalist> <details> <figcaption> <figure> <footer> <header> <hgroup> <keygen> <main> <mark> <menu> <meter> <nav> <output> <progress> <rp> <rt> <ruby> <section> <source> <summary> <time> <video> <wbr><br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide34" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/397649/slide-33.jpg" target="_blank" rel="noopener">Слайд 34</a><h3 class="slides-content text-center font-bold"><div><p>HTML 5!!!<br><p>А это полезные теги, ориентированные на роботов, занимающихся интерпретацией текста, которые можно</div></h3></h3><!----><!----><div class="slides-content">использовать вместо <div><br><article> задает содержание сайта вроде новости, статьи, записи блога, форума или др.<br><aside> определяет блок сбоку от контента для размещения рубрик, ссылок на архив, меток и другой информации. Такой блок, как правило, называется «сайдбар» или «боковая панель».<br><footer> задаёт «подвал» сайта или раздела, в нём может располагается имя автора, дата документа, контактная и правовая информация.<br><header> задает «шапку» сайта или раздела, в которой обычно располагается заголовок.<br><nav> задает навигацию по сайту. Если на странице несколько блоков ссылок, то в <nav> обычно помещают приоритетные ссылки. Также допустимо использовать несколько тегов <nav> в документе. <br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide35" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/397649/slide-34.jpg" target="_blank" rel="noopener">Слайд 35</a><h3 class="slides-content text-center font-bold"><div><p>HTML 5!!!<br><p>И еще немного полезной информации<br><<audio> - Добавляет, воспроизводит и управляет настройками аудиозаписи</div></h3></h3><!----><!----><div class="slides-content">на веб-странице. Путь к файлу задается через атрибут src или вложенный тег <source>. Внутри контейнера <audio> можно написать текст, который будет выводиться в браузерах, не работающих с этим тегом.<br><audio src="URL"></audio> <br><audio> <source src="URL"> </audio><br>Атрибуты<br>autoplay - звук начинает играть сразу после загрузки страницы. сontrols - добавляет панель управления к аудиофайлу.<br>loop - повторяет воспроизведение звука с начала после его завершения.<br>preload - используется для загрузки файла вместе с загрузкой веб-страницы.<br>src - указывает путь к воспроизводимому файлу.<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide36" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/397649/slide-35.jpg" target="_blank" rel="noopener">Слайд 36</a><h3 class="slides-content text-center font-bold"><div><p>HTML 5!!!<br><p>И еще немного полезной информации<br><video> - Добавляет, воспроизводит и управляет настройками видеоролика</div></h3></h3><!----><!----><div class="slides-content">на веб-странице. Путь к файлу задается через атрибут src или вложенный тег <source>.<br>< video src="URL"></ video > <br>< video > <source src="URL"> </ video ><br>Атрибуты<br>Autoplay - видео начинает воспроизводиться автоматически после загрузки страницы. Controls - добавляет панель управления к видеоролику. Height - задает высоту области для воспроизведения видеоролика. Loop - повторяет воспроизведение видео с начала после его завершения. Poster - указывает адрес картинки, которая будет отображаться, пока видео не доступно или не воспроизводится. Preload - используется для загрузки видео вместе с загрузкой веб-страницы. Src - указывает путь к воспроизводимому видеоролику. Width - задает ширину области для воспроизведения видеоролика.<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide37" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/397649/slide-36.jpg" target="_blank" rel="noopener">Слайд 37</a><h3 class="slides-content text-center font-bold"><div><p>HTML 5!!!<br><p>И еще немного полезной информации<br><<canvas> - создает область, в которой при помощи</div></h3></h3><!----><!----><div class="slides-content">JavaScript можно рисовать разные объекты, выводить изображения, трансформировать их и менять свойства. При помощи тега <canvas> можно создавать рисунки, анимацию, игры и др.<br> Атрибуты<br>Height - Задает высоту холста. По умолчанию 300 пикселов.<br>Width - Задает ширину холста. По умолчанию 150 пикселов.<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><!----></div><!--]--></div><div class="section"><div></div></div><form id="download" action="/api/" method="post" class="download"><!----><div class="download-description"> Имя файла: HTML.-Язык-гипертекстовой-разметки.pptx <br> Количество просмотров: 27 <br> Количество скачиваний: 0</div><button class="download-btn" type="submit">Скачать</button><!----></form><div class="navigation"><div class="navigation-item"><div>- Предыдущая</div><a href="/medetsina/complete-blood-count-cbc" class="navigation-link">Complete blood count (CBC)</a></div><div class="navigation-item"><div>Следующая -</div><a href="/fizika/el-tok-v-metallah-deystvie-i" class="navigation-link">Эл. ток в металлах. Действие и направление эл. тока 8 класс</a></div></div></div></div><div class="item-layoutRelated"><div class="section"><div></div></div></div></div><div class="item-layout"><div class="related"><h2 class="related-header">Похожие презентации</h2><div class="related-wrapper"><!--[--><div class="related-item"><a href="/informatika/sotsialnye-seti-4" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/16634/slide-0.jpg" 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/16634/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/16634/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/16634/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/16634/slide-0.jpg 1440w" class="slides-image related-itemImage"> Социальные сети</a></div><div class="related-item"><a href="/informatika/pastrovaya-i-vektornaya-grafika" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/337031/slide-0.jpg" 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/337031/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/337031/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/337031/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/337031/slide-0.jpg 1440w" class="slides-image related-itemImage"> Pастровая и векторная графика</a></div><div class="related-item"><a href="/informatika/podhody-k-ponyatiyu-informatsii-i-izmereniya" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/224588/slide-0.jpg" 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/224588/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/224588/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/224588/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/224588/slide-0.jpg 1440w" class="slides-image related-itemImage"> Подходы к понятию информации и измерения</a></div><div class="related-item"><a href="/informatika/programuvannya-u-visual-studio" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/594150/slide-0.jpg" 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/594150/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/594150/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/594150/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/594150/slide-0.jpg 1440w" class="slides-image related-itemImage"> Програмування у Visual Studio</a></div><div class="related-item"><a href="/informatika/virusa-arsy-programmalar" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/7714/slide-0.jpg" 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/7714/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/7714/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/7714/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/7714/slide-0.jpg 1440w" class="slides-image related-itemImage"> Вирусқа қарсы программалар</a></div><div class="related-item"><a href="/informatika/delovoy-chat-bot" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/122882/slide-0.jpg" 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/122882/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/122882/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/122882/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/122882/slide-0.jpg 1440w" class="slides-image related-itemImage"> Деловой чат-бот</a></div><div class="related-item"><a href="/informatika/b2b-kabinet-pokupki-na-sayte-citilinkru" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/423758/slide-0.jpg" 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/423758/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/423758/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/423758/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/423758/slide-0.jpg 1440w" class="slides-image related-itemImage"> B2B Кабинет. Покупки на сайте citilink.ru</a></div><div class="related-item"><a href="/informatika/bltty-esepteuler-zhne-yaly-baylanys-tehnologiyalaryn-1" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/143246/slide-0.jpg" 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/143246/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/143246/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/143246/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/143246/slide-0.jpg 1440w" class="slides-image related-itemImage"> Бұлттық есептеулер және ұялы байланыс технологияларын интеграциялау</a></div><div class="related-item"><a href="/informatika/kommunikativnaya-priroda-informatsionnogo-obshchestva-7" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/438727/slide-0.jpg" 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/438727/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/438727/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/438727/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/438727/slide-0.jpg 1440w" class="slides-image related-itemImage"> Коммуникативная природа информационного общества</a></div><div class="related-item"><a href="/informatika/elektronnaya-pochta-11" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/205270/slide-0.jpg" 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/205270/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/205270/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/205270/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/205270/slide-0.jpg 1440w" class="slides-image related-itemImage"> Электронная почта</a></div><div class="related-item"><a href="/informatika/sozdanie-polzovatelskoy-biblioteki-komponentov-prokladka-truboprovodnyh" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/105602/slide-0.jpg" 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/105602/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/105602/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/105602/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/105602/slide-0.jpg 1440w" class="slides-image related-itemImage"> Создание пользовательской библиотеки компонентов. Прокладка трубопроводных и кабельных систем</a></div><div class="related-item"><a href="/informatika/informatika-bazovyy-kurs" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/101529/slide-0.jpg" 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/101529/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/101529/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/101529/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/101529/slide-0.jpg 1440w" class="slides-image related-itemImage"> Информатика. Базовый курс</a></div><div class="related-item"><a href="/informatika/mstse-yuzablt-v-protses-rozrobki" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/345616/slide-0.jpg" 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/345616/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/345616/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/345616/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/345616/slide-0.jpg 1440w" class="slides-image related-itemImage"> Місце Юзабіліті в процесі розробки</a></div><div class="related-item"><a href="/informatika/dvovimrn-masivi" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/202976/slide-0.jpg" 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/202976/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/202976/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/202976/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/202976/slide-0.jpg 1440w" class="slides-image related-itemImage"> Двовимірні масиви</a></div><div class="related-item"><a href="/informatika/sostavnye-chasti-os" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/397557/slide-0.jpg" 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/397557/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/397557/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/397557/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/397557/slide-0.jpg 1440w" class="slides-image related-itemImage"> Составные части ОС</a></div><div class="related-item"><a href="/informatika/instruktsiya-po-ispolzovaniyu-enhancesys" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/263514/slide-0.jpg" 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/263514/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/263514/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/263514/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/263514/slide-0.jpg 1440w" class="slides-image related-itemImage"> Инструкция по использованию Enhancesys</a></div><div class="related-item"><a href="/informatika/svoystva-algoritmov-prezentatsiya-9-klass" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/547975/slide-0.jpg" 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/547975/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/547975/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/547975/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/547975/slide-0.jpg 1440w" class="slides-image related-itemImage"> Свойства алгоритмов, презентация, 9 класс</a></div><div class="related-item"><a href="/informatika/primery-programm-na-yap-paskal-chast" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/167812/slide-0.jpg" 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/167812/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/167812/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/167812/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/167812/slide-0.jpg 1440w" class="slides-image related-itemImage"> Примеры программ на ЯП Паскаль. Часть 2</a></div><div class="related-item"><a href="/informatika/ekstremalnoe-programmirovanie-xp-metafora" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/225327/slide-0.jpg" 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/225327/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/225327/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/225327/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/225327/slide-0.jpg 1440w" class="slides-image related-itemImage"> Экстремальное программирование (XP). Метафора</a></div><div class="related-item"><a href="/informatika/trenazhyor-ustroystva-kompyutera" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/571929/slide-0.jpg" 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/571929/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/571929/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/571929/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/571929/slide-0.jpg 1440w" class="slides-image related-itemImage"> Тренажёр Устройства компьютера</a></div><div class="related-item"><a href="/informatika/smi-vvedenie-v-professiyu-vtoroe-zanyatie" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/102730/slide-0.jpg" 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/102730/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/102730/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/102730/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/102730/slide-0.jpg 1440w" class="slides-image related-itemImage"> СМИ. Введение в профессию. Второе занятие</a></div><div class="related-item"><a href="/informatika/obrabotka-informatsii-9" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/381964/slide-0.jpg" 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/381964/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/381964/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/381964/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/381964/slide-0.jpg 1440w" class="slides-image related-itemImage"> Обработка информации</a></div><div class="related-item"><a href="/informatika/algebra-vyskazyvaniy-logicheskie-vyrazheniya" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/169910/slide-0.jpg" 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/169910/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/169910/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/169910/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/169910/slide-0.jpg 1440w" class="slides-image related-itemImage"> Алгебра высказываний. Логические выражения</a></div><div class="related-item"><a href="/informatika/puteshestvie-po-klavisham-1" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/315440/slide-0.jpg" 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/315440/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/315440/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/315440/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/315440/slide-0.jpg 1440w" class="slides-image related-itemImage"> Путешествие по клавишам</a></div><div class="related-item"><a href="/informatika/struktura-i-printsipy-postroeniya-seti-internet" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/281695/slide-0.jpg" 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/281695/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/281695/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/281695/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/281695/slide-0.jpg 1440w" class="slides-image related-itemImage"> Структура и принципы построения сети интернет</a></div><div class="related-item"><a href="/informatika/sredstva-modulnogo-programmirovaniya" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/371715/slide-0.jpg" 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/371715/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/371715/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/371715/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/371715/slide-0.jpg 1440w" class="slides-image related-itemImage"> Средства модульного программирования</a></div><div class="related-item"><a href="/informatika/prodvizhenie-saytov-2" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/428849/slide-0.jpg" 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/428849/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/428849/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/428849/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/428849/slide-0.jpg 1440w" class="slides-image related-itemImage"> Продвижение сайтов</a></div><div class="related-item"><a href="/informatika/zhiymdar-brlshemd-zhiym" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/378834/slide-0.jpg" 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/378834/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/378834/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/378834/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/378834/slide-0.jpg 1440w" class="slides-image related-itemImage"> Жиымдар. Бірөлшемді жиым</a></div><!--]--></div></div></div></div><!--]--><!--]--><!--]--></div></div></main><footer class="footer"><div class="layout"><!----><div class="footer-contacts"><svg class="footer-contactsIcon" viewBox="0 0 27 26" xmlns="http://www.w3.org/2000/svg"><use xlink:href="/images/icons.svg#contacts"></use></svg> Обратная связь</div><!----><div class="footer-contactsEmail"> Email: <span class="footer-contactsShow">Нажмите что бы посмотреть</span></div></div></footer></div><!--]--></div><script>window.__NUXT__=(function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R){return {data:{meta:{result:{meta:{h1:l,main_text:a,main_title:m,main_description:n,main_keywords:o,main_image:a},app:{logo_image:p,logo_image_width:q,logo_image_height:r,logo_text:a,image_width_full:s,image_width_min:t,recaptcha_key:u,yandex_search:v,ya_context:c,banner_1:a,banner_2:a,banner_3:a,banner_4:a,banner_5:a,banner_6:a,banner_7:a,banner_8:a,banner_9:a,banner_10:a,email:w,footer_before:a,footer:a,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:x,item_images:y,item_images_tag:z,item_words_h3:c,item_words_tag:A,item_words_1:h,routing:B,item_slide_skipping:C,item_download_timeout:D,item_slider_width:E,item_show_pdf:e,item_show_contents:e,item_show_filename:e},colors:{header_text:j,header_bg:i,accent:i}},social:F}},item:{result:{id:397649,name:k,category:G,count:38,jpg:"jpg\u002F397649",hits:H,download:b,h1:"HTML. Язык гипертекстовой разметки презентация",meta:{h1:k,title:k,description:"HTML. Язык гипертекстовой разметки презентация на тему, доклад, Информатика",keywords:"HTML. Язык гипертекстовой разметки, презентация, доклад, проект, скачать, на тему, PowerPoint, урок, класс, школа, Информатика",download_link:a},text:"Вы можете изучить и скачать доклад-презентацию на тему Презентация на тему HTML. Язык гипертекстовой разметки из раздела Информатика. Презентация на заданную тему содержит 38 слайдов. Для просмотра воспользуйтесь проигрывателем, если материал оказался полезным для Вас - поделитесь им с друзьями с помощью социальных кнопок и добавьте наш сайт презентаций в закладки!",seo_text:"\u003Cp\u003EИстория HTML\u003Cbr\u003E\u003Cp\u003EHTML 1.0 – 1989 г.\u003Cbr\u003EHTML 2.0 – 1991 г.\u003Cbr\u003EHTML 3.0 – 1995 г.\u003Cbr\u003EHTML 4.0 – 1998 г. , HTML 4.01 –1999 г.\u003Cbr\u003EHTML 5.0 – не утвержден по сей день\u003Cbr\u003E \u003Cbr\u003E \u003Cp\u003EБраузеры должны знать какой стандарт HTML вы используете!!!\u003Cbr\u003E\u003Cp\u003EПереходная версия к HTML 4.01\u003Cbr\u003E\u003Cbr\u003E",file:"HTML.-Язык-гипертекстовой-разметки.pptx",texts:["\u003Cp\u003EЯзык гипертекстовой разметки.\u003Cbr\u003E\u003Cp\u003EHTML \u003Cbr\u003E","\u003Cp\u003EИстория HTML\u003Cbr\u003E\u003Cp\u003EHTML 1.0 – 1989 г.\u003Cbr\u003EHTML 2.0 – 1991 г.\u003Cbr\u003EHTML 3.0 – 1995 г.\u003Cbr\u003EHTML 4.0 – 1998 г. , HTML 4.01 –1999 г.\u003Cbr\u003EHTML 5.0 – не утвержден по сей день\u003Cbr\u003E \u003Cbr\u003E","\u003Cp\u003EБраузеры должны знать какой стандарт HTML вы используете!!!\u003Cbr\u003E\u003Cp\u003EПереходная версия к HTML 4.01\u003Cbr\u003E","\u003Cp\u003EБраузеры должны знать какой стандарт HTML вы используете!!!\u003Cbr\u003E\u003Cp\u003EСтрогая версия HTML 4.01\u003Cbr\u003E","\u003Cp\u003EБраузеры должны знать какой стандарт HTML вы используете!!!\u003Cbr\u003E\u003Cp\u003EДля HTML 5.0 достаточно:\u003Cbr\u003E\u003Cp\u003E\u003C!DOCTYPE html\u003E \u003Cbr\u003E\u003Cp\u003EОн прощает все!!!\u003Cbr\u003E\u003Cp\u003Ehttp:\u002F\u002Fvalidator.w3.org\u002F \u003Cbr\u003Eпроверка кода на валидность и соотвествие стандартам\u003Cbr\u003E","\u003Cp\u003EОсновные понятия\t\t\u003Cbr\u003E\u003Cp\u003EТеги (от англ. «tag»-отметка)- операторы и команды HTML.\u003Cbr\u003EВсе теги заключаются в \u003Cbr\u003E\u003C \u003E. \u003Cbr\u003EСледует заметить, что практически все теги надо закрывать:\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003EТеги web-страницы\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003EВ закрывающем теге ставится \u002F\u003Cbr\u003E\u003C!– Так добавляются комментарии--\u003E\u003Cbr\u003E","\u003Cp\u003EОсновные понятия\t\t\u003Cbr\u003EТеги делятся на:\u003Cbr\u003EБлочные элементы предназначены для структурирования основных частей вашей страницы, путём разделения содержимого на логически связанные блоки.\u003Cbr\u003EСтрочные элементы предназначены, чтобы разграничить часть текста и придать ему определённую функцию или смысл. Строчные элементы, как правило, содержат одно или несколько слов.\u003Cbr\u003E","\u003Cp\u003EСтруктура документа\u003Cbr\u003E\u003Cp\u003EЛюбая web-страница задается следующими тэгами:\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Chead\u003E\u003Cbr\u003E\u003Ctitle\u003ESite name\u003C\u002Ftitle\u003E\u003Cbr\u003E\u003C\u002Fhead\u003E\u003Cbr\u003E\u003Cbody\u003E\u003Cbr\u003EСодержимое страницы\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003E","\u003Cp\u003EСтруктура документа\u003Cbr\u003E","\u003Cp\u003EГолова документа.\u003Cbr\u003E\u003Cp\u003E\u003Chead\u003E\u003Cbr\u003E\u003Ctitle\u003EЗаголовок документа\u003C\u002Ftitle\u003E\u003Cbr\u003E\u003Cmeta http-equiv=\"Content-Type\" content=\"text\u002Fhtml; charset=utf-8 или windows-1251\"\u003E\u003Cbr\u003E\u003Cmeta charset=\"utf-8\"\u003E - стандарт HTML 5\u003Cbr\u003E\u003Cmeta name=\"keywords\" content=\"тег, поисковая система\"\u003E \u003Cbr\u003E\u003Cmeta name=“description\" content=\"это сайт про теги\"\u003E \u003Cbr\u003E\u003Cstyle\u003E применяется для определения стилей элементов веб-страницы. \u003C\u002Fstyle\u003E\u003Cbr\u003E\u003C\u002Fhead\u003E\u003Cbr\u003E","\u003Cp\u003EТело документа.\u003Cbr\u003E\u003Cbr\u003E\u003Cbody\u003E\u003Cbr\u003EПредназначен для хранения содержания веб-страницы (контента),отображаемого в окне браузера. \u003Cbr\u003EИнформацию, которую следует выводить в документе, следует располагать именно внутри контейнера\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E","\u003Cp\u003EТело документа\u003Cbr\u003E\u003Cp\u003EАтрибуты тега \u003Cbody\u003E\u003Cbr\u003EAlink -Устанавливает цвет активной ссылки.\u003Cbr\u003EBackground - Задает фоновый рисунок на веб-странице.\u003Cbr\u003EBgcolor - Цвет фона веб-страницы.\u003Cbr\u003EBgproperties - Определяет, прокручивать фон совместно с текстом или нет.\u003Cbr\u003EBottommargin - Отступ от нижнего края окна браузера до контента.\u003Cbr\u003ELeftmargin - Отступ по горизонтали от левого края окна браузера до контента.\u003Cbr\u003ELink - Цвет ссылок на веб-странице.\u003Cbr\u003ERightmargin - Отступ от правого края окна браузера до контента.\u003Cbr\u003EScroll - Устанавливает, отображать полосы прокрутки или нет.\u003Cbr\u003EText - Цвет текста в документе.\u003Cbr\u003ETopmargin -Отступ от верхнего края окна браузера до контента.\u003Cbr\u003EVlink - Цвет посещенных ссылок.\u003Cbr\u003E","\u003Cp\u003EТеги форматирования текста\u003Cbr\u003E\u003Cp\u003E\u003Ch1\u003E,...,\u003Ch6\u003E - HTML предлагает шесть заголовков разного уровня, которые показывают относительную важность секции, расположенной после заголовка.\u003Cbr\u003E\u003Cb\u003EУстанавливает жирное начертание шрифта.\u003C\u002Fb\u003E\u003Cbr\u003E\u003Cstrong\u003EПредназначен для акцентирования текста. Браузеры отображают такой текст жирным начертанием.\u003C\u002Fstrong\u003E\u003Cbr\u003E\u003Cem\u003EПредназначен для акцентирования текста. Браузеры отображают такой текст курсивным начертанием.\u003C\u002Fem\u003E\u003Cbr\u003E\u003Ci\u003EУстанавливает курсивное начертание шрифта.\u003C\u002Fi\u003E\u003Cbr\u003E\u003Cq\u003EИспользуется для выделения в тексте цитат.\u003C\u002Fq\u003E\u003Cbr\u003E\u003Cblockquote\u003EПредназначен для выделения длинных цитат внутри документа.\u003C\u002Fblockquote\u003E\u003Cbr\u003E \u003Cbr\u003E устанавливает перевод строки в том месте, где этот тег находится.\u003Cbr\u003E\u003Cp align=\"left | center | right | justify\"\u003EОпределяет текстовый абзац.\u003C\u002Fp\u003E\u003Cbr\u003E\u003Cdiv align=\"center | left | right | justify\" title=\"текст\"\u003EЯвляется блочным элементом и предназначен для выделения фрагмента документа с целью изменения вида содержимого. Как правило, вид блока управляется с помощью стилей. \u003C\u002Fdiv\u003E\u003Cbr\u003E","\u003Cp\u003EГиперссылки\u003Cbr\u003E\u003Cp\u003EТег \u003Ca\u003E:\u003Cbr\u003Ehref=“путь” – связь с объектом, на который идет ссылка\u003Cbr\u003Etarget=“название” – указание того окна, где будет открываться объект:\u003Cbr\u003E_blank - Загружает страницу в новое окно браузера.\u003Cbr\u003E_self -Загружает страницу в текущее окно.\u003Cbr\u003E_parent -Загружает страницу во фрейм-родитель, если фреймов нет, то это значение работает как _self.\u003Cbr\u003E_top -Отменяет все фреймы и загружает страницу в полном окне браузера, если фреймов нет, то это значение работает как _self.\u003Cbr\u003EПример:\u003Cbr\u003E\u003Ca href=“index.htm” target=“_blank”\u003ELink\u003C\u002Fa\u003E\u003Cbr\u003E\u003Ca href=“menu\u002Fmenu.htm” target=“_blank”\u003ELink\u003C\u002Fa\u003E\u003Cbr\u003E\u003Ca href=“..\u002Fmenu\u002Fmenu.htm” target=“_blank”\u003ELink\u003C\u002Fa\u003E\u003Cbr\u003E\u003Cbr\u003E","\u003Cp\u003E«Якоря»\u003Cbr\u003E\u003Cp\u003EЯкорь – специальная метка в документе, невидимый объект, на который можно создать ссылку.\u003Cbr\u003EВставка якоря:\r\n\u003Ca name=“название”\u003E\u003C\u002Fa\u003E\u003Cbr\u003EСсылка на якорь:\u003Cbr\u003E\u003Ca href=“#название”\u003Eтекст\u003C\u002Fa\u003E\u003Cbr\u003EСсылка на якорь на другой странице:\u003Cbr\u003E\u003Ca href=“название страницы#название”\u003Eтекст\u003C\u002Fa\u003E\u003Cbr\u003E","\u003Cp\u003EВставка изображений\u003Cbr\u003E\u003Cp\u003EТег \u003Cimg\u003E:\u003Cbr\u003ESrc=“путь” – привязка к объекту\u003Cbr\u003EWidth=“число” – ширина\u003Cbr\u003EHeight =“число” – длина\u003Cbr\u003EBorder=“число” – толщина границ\u003Cbr\u003EBordercolor=“#цвет” – цвет границ\u003Cbr\u003EAlign=“значение”- расположение объекта:\u003Cbr\u003ELeft\u003Cbr\u003ERight\u003Cbr\u003EAlt= Альтернативный текст для изображения.\u003Cbr\u003ETitle = Название рисунка\u003Cbr\u003EПример:\u003Cimg src=\"pics\u002Fpanorama.jpg\" width=\"30%\" height=\"30%\" border=\"3\" align=\"right“ alt=“панорама” title=“панорама”\u003E\u003Cbr\u003ETег \u003Cimg\u003E закрывать НЕ НАДО\u003Cbr\u003E","\u003Cp\u003EСписки\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EТег \u003Ctablе\u003E:\u003Cbr\u003EWidth=“число” – ширина\u003Cbr\u003EHeight =“число” – длина\u003Cbr\u003EBorder=“число” – толщина границ\u003Cbr\u003EBordercolor=“#цвет”- цвет границ\u003Cbr\u003EBgcolor=“#цвет” – фон\u003Cbr\u003ECellspacing=“число”- расстояние между ячейками\u003Cbr\u003EAlign=“значение”- центровка\u003Cbr\u003E","\u003Cp\u003EСтроки и ячейки.\u003Cbr\u003E\u003Cp\u003EВставка строки – тег \u003Ctr\u003E\u003C\u002Ftr\u003E\u003Cbr\u003EВставка ячейки – тег \u003Ctd\u003E\u003C\u002Ftd\u003E:\u003Cbr\u003EWidth=“число” – ширина\u003Cbr\u003EHeight =“число” – длина\u003Cbr\u003EBorder=“число” – толщина границ\u003Cbr\u003EBordercolor=“#цвет”- цвет границ\u003Cbr\u003EBgcolor=“#цвет” – фон\u003Cbr\u003EColspan=“число”- кол-во столбцов, которое занимает ячейка.\u003Cbr\u003ERowspan = устанавливает число ячеек, которые должны быть объединены по вертикали.\u003Cbr\u003E","\u003Cp\u003EПример\u003Cbr\u003E\u003Cp\u003E\u003Ctable width=100% border=5 bordercolor=#000000 bgcolor=“#FFF000” cellspacing=0\u003E\u003Cbr\u003E\u003Ctr\u003E\u003Cbr\u003E\u003Ctd colspan=3\u003Etext\u003C\u002Ftd\u003E\u003Cbr\u003E\u003C\u002Ftr\u003E\u003Cbr\u003E\u003Ctr\u003E\u003Cbr\u003E\u003Ctd width=30%\u003Etext\u003C\u002Ftd\u003E\u003Cbr\u003E\u003Ctd width=40%\u003Etext\u003C\u002Ftd\u003E\u003Cbr\u003E\u003Ctd width=30%\u003Etext\u003C\u002Ftd\u003E\u003Cbr\u003E\u003C\u002Ftr\u003E\u003Cbr\u003E\u003Ctr\u003E\u003Cbr\u003E\u003Ctd colspan=2 width=70%\u003Etext\u003C\u002Ftd\u003E\u003Cbr\u003E\u003Ctd\u003Etext\u003C\u002Ftd\u003E\u003Cbr\u003E\u003C\u002Ftr\u003E\u003Cbr\u003E\u003C\u002Ftable\u003E\u003Cbr\u003E","\u003Cp\u003EЗадание\u003Cbr\u003E","\u003Cp\u003EФормы\t\u003Cbr\u003E\u003Cp\u003EТег \u003Cform\u003E устанавливает форму на веб-странице. Форма предназначена для обмена данными между пользователем и сервером. Область применения форм не ограничена отправкой данных на сервер, с помощью клиентских скриптов можно получить доступ к любому элементу формы, изменять его и применять по своему усмотрению.\u003Cbr\u003EДля отправки формы на сервер используется кнопка Submit, того же можно добиться, если нажать клавишу Enter в пределах формы. Если кнопка Submit отсутствует в форме, клавиша Enter имитирует ее использование.\u003Cbr\u003EКогда форма отправляется на сервер, управление данными передается программе, заданной атрибутом action тега\u003Cform\u003E. Предварительно браузер подготавливает информацию в виде пары «имя=значение», где имя определяется атрибутом name тега \u003Cinput\u003E\u003Cbr\u003E","\u003Cp\u003EФормы\t\u003Cbr\u003E\u003Cp\u003EСинтаксис - \u003Cform action=\"URL\"\u003E ... \u003C\u002Fform\u003E\u003Cbr\u003E\u003Cform action=\"handler.php\"\u003E\u003Cbr\u003E \u003Cp\u003E\u003Cb\u003EКак по вашему мнению расшифровывается аббревиатура "ОС"?\u003C\u002Fb\u003E\u003C\u002Fp\u003E \u003Cbr\u003E\u003Cp\u003E \u003Cinput type=\"radio\" name=\"answer\" value=\"a1\"\u003EОфицерский состав\u003CBr\u003E \u003Cbr\u003E\u003Cinput type=\"radio\" name=\"answer\" \u003Cbr\u003Evalue=\"a2\"\u003EОперационная система\u003Cbr\u003E\u003CBr\u003E \u003Cbr\u003E\u003Cinput type=\"radio\" name=\"answer\" \u003Cbr\u003Evalue=\"a3\"\u003EБольшой полосатый мух\u003C\u002Fp\u003E \u003Cp\u003E\u003Cinput type=\"submit\"\u003E\u003C\u002Fp\u003E \u003Cbr\u003E\u003C\u002Fform\u003E\u003Cbr\u003E","\u003Cp\u003EФормы\u003Cbr\u003E\u003Cp\u003EТег \u003Cinput\u003E является одним из разносторонних элементов формы и позволяет создавать разные элементы интерфейса и обеспечить взаимодействие с пользователем. Главным образом \u003Cinput\u003E предназначен для создания текстовых полей, различных кнопок, переключателей и флажков. Хотя элемент \u003Cinput\u003E не требуется помещать внутрь контейнера \u003Cform\u003E, определяющего форму, но если введенные пользователем данные должны быть отправлены на сервер, где их обрабатывает серверная программа, то указывать \u003Cform\u003E обязательно. То же самое обстоит и в случае обработки данных с помощью клиентских приложений, например, скриптов на языке JavaScript.\u003Cbr\u003E","\u003Cp\u003EФормы\u003Cbr\u003E\u003Cp\u003EОсновной атрибут тега \u003Cinput\u003E, определяющий вид элемента — type. Он позволяет задавать следующие элементы формы: текстовое поле (text), поле с паролем (password), переключатель (radio), флажок (checkbox), скрытое поле (hidden), кнопка (button), кнопка для отправки формы (submit), кнопка для очистки формы (reset), поле для отправки файла (file) и кнопка с изображением (image). Для каждого элемента существует свой список атрибутов, которые определяют его вид и характеристики.\u003Cbr\u003E\u003Cform name=\"test\" method=\"post\" action=\"input1.php\"\u003E \u003Cp\u003E\u003Cb\u003EВаше имя:\u003C\u002Fb\u003E\u003Cbr\u003E \u003Cinput type=\"text\" size=\"40\"\u003E \u003C\u002Fp\u003E \u003Cp\u003E\u003Cb\u003EКаким браузером в основном пользуетесь:\u003C\u002Fb\u003E\u003CBr\u003E \u003Cinput type=\"radio\" name=\"browser\" value=\"ie\"\u003E Internet Explorer\u003CBr\u003E \u003Cinput type=\"radio\" name=\"browser\" value=\"opera\"\u003E Opera\u003CBr\u003E \u003Cinput type=\"radio\" name=\"browser\" value=\"firefox\"\u003E Firefox\u003CBr\u003E \u003C\u002Fp\u003E \u003Cp\u003EКомментарий\u003CBr\u003E \u003Ctextarea name=\"comment\" cols=\"40\" rows=\"3\"\u003E\u003C\u002Ftextarea\u003E\u003C\u002Fp\u003E \u003Cp\u003E\u003Cinput type=\"submit\" value=\"Отправить\"\u003E \u003Cinput type=\"reset\" value=\"Очистить\"\u003E\u003C\u002Fp\u003E \u003C\u002Fform\u003E \u003Cbr\u003E","\u003Cp\u003EФормы\u003Cbr\u003E","\u003Cp\u003EСтили внутри документа\u003Cbr\u003E\u003Cp\u003E\u003Cstyle\u003E Применяется для определения стилей элементов веб-страницы. Тег необходимо использовать внутри контейнера \u003Chead\u003E. Можно задавать более чем один тег \u003C\u002Fstyle\u003E\u003Cbr\u003E\u003Chtml\u003E \u003Cbr\u003E\t\u003Chead\u003E \u003Cbr\u003E\t\t\u003Cmeta charset=\"utf-8\"\u003E\u003Cbr\u003E \t\t\u003Ctitle\u003EТег STYLE\u003C\u002Ftitle\u003E \u003Cbr\u003E\t\t\u003Cstyle type=\"text\u002Fcss\"\u003E \u003Cbr\u003E\t\t\th1 { font-size: 120%; font-family: Verdana, Arial, \t\t\t\tHelvetica, sans-serif; color: #333366; }\u003Cbr\u003E \t\t\u003C\u002Fstyle\u003E \u003Cbr\u003E\t\u003C\u002Fhead\u003E \u003Cbr\u003E\t\u003Cbody\u003E \u003Cbr\u003E\t\t\u003CH1\u003EHello, world!\u003C\u002FH1\u003E\u003Cbr\u003E\t \u003C\u002Fbody\u003E \u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003E","\u003Cp\u003EЭто надо помнить!!!\u003Cbr\u003E\u003Cp\u003EЭлемент \u003Chtml\u003E: не выходите из дома без него.\u003Cbr\u003EВсегда начинайте свою страницу с оnределения DОСТУРЕ, а сразу за ним указывайте \u003Chtml\u003E, который всегда должен быть корневым элементом вашей веб-страницы Итак, nосле DОСТУРЕ тег \u003Chtml\u003E должен начинать вашу страницу, тег \u003C\u002Fhtml\u003E- заканчивать, а все остальное должно быть вложено в него.\u003Cbr\u003EВсегда используйте \u003Chead\u003E и \u003Cbоdу\u003E, чтобы НТМL-код\u003Cbr\u003Eбыл лучше.\u003Cbr\u003EТолько элементы \u003Chead\u003E и \u003CЬоdу\u003E могут наnрямую быть вложены\u003Cbr\u003Eв элемент \u003Chtml\u003E. Это означает, что все остальные элементы\u003Cbr\u003Eдолжны располагаться внутри элементов \u003Chead\u003E или \u003Cbоdу\u003E.\u003Cbr\u003EВсе без исключения!\u003Cbr\u003E","\u003Cp\u003EЭто надо помнить!!!\u003Cbr\u003E\u003Cp\u003EЧто такое \u003Chead\u003E без \u003Ctitle\u003E?\u003Cbr\u003EВ элементе \u003Chead\u003E всегда помещайте элемент \u003Ctitle\u003E. Это\u003Cbr\u003Eзакон. Если вы этого не сделаете, то HTML будет признан\u003Cbr\u003Eне соответствующим стандартам. Элемент \u003Chead\u003E - единственный,\u003Cbr\u003Eв который вы можете помещать элементы \u003Ctitle\u003E, \u003Cmeta\u003E и \u003Cstyle\u003E.\u003Cbr\u003EНаполняйте элемент \u003Cbody\u003E только полезными блочными\u003Cbr\u003Eэлементами.\u003Cbr\u003EНеnосредственно внутрь элемента \u003Cbоdу\u003E вы можете помещать\u003Cbr\u003Eтолько блочные элементы ( \u003Chl\u003E, \u003Ch2\u003E ... \u003Chб\u003E, \u003Cр\u003E, \u003Cblocltquote\u003E\u003Cbr\u003Eи т. д.). Строчные элементы и текст необходимо сначала поместить\u003Cbr\u003Eв другой блочный элемент, и только затем они смогут войти\u003Cbr\u003Eв состав элемента \u003Cbоdу\u003E.\u003Cbr\u003E","\u003Cp\u003EЭто надо помнить!!!\u003Cbr\u003E\u003Cp\u003EНикогда не помещайте блочные элементы внутрь строчных.\u003Cbr\u003EВнутрь строчных элементов вы можете помещать только другие\u003Cbr\u003Eстрочные элементы или текст. Блочные элементы не могут входить\u003Cbr\u003Eвнутрь строчных ни при каких обстоятельствах.\u003Cbr\u003EНе помещайте блочные элементы внутрь элемента \u003Cр\u003E.\u003Cbr\u003EАбзацы предназначены для текста, поэтому не нужно помещать\u003Cbr\u003Eв них блочные элементы. Но, конечно же, любые строчные элементы\u003Cbr\u003Eможно использовать внутри абзацев (\u003Cem\u003E, \u003Cа\u003E, \u003Cstrong\u003E, \u003Cimq\u003E,\u003Cbr\u003E\u003Cq\u003E и т. д.).\u003Cbr\u003E","\u003Cp\u003EЭто надо помнить!!!\u003Cbr\u003E\u003Cp\u003EСписки предназначены для перечисления пунктов.\u003Cbr\u003EВнутри элементов \u003Cul\u003E и \u003Col\u003E разрешается использовать только\u003Cbr\u003Eэлемент \u003Cli\u003E. Но зачем вам помещать в упорядоченный или неупо рядоченный список что-то, кроме его пунктов?\u003Cbr\u003EПродолжим. Помещайте любые элементы внутрь\u003Cbr\u003Eэлементов сnиска.\u003Cbr\u003EВнутрь элементов списка \u003Cli\u003E вы можете помещать любой текст, а также строчные или блочные элементы .\u003Cbr\u003E","\u003Cp\u003EЭто надо помнить!!!\u003Cbr\u003E\u003Cp\u003EКто бы мог подумать? Элемент \u003Cblockquote\u003E любит\u003Cbr\u003Eтолько блочные элементы.\u003Cbr\u003EЭлемент \u003Cblockquote\u003E требует, чтобы внутри его было не менее одного блочного элемента. Пожалуйста, всегда помещайте ваш текст и другие строчные элементы в блочные элементы и уже эти блочные элементы добавляйте в \u003Cblockquote\u003E.\u003Cbr\u003EБудьте внимательны, когда вкладываете строчные\u003Cbr\u003Eэлементы друг в друга.\u003Cbr\u003EНесмотря на то что вы можете успешно вкладывать некоторые\u003Cbr\u003Eстрочные элементы друг в друга, все же есть несколько случаев,\u003Cbr\u003Eв которых это действие нелогично и бессмысленно . Никогда не\u003Cbr\u003Eвкладывайте элемент \u003Cа\u003E внутрь другого элемента \u003Cа\u003E, потому что\u003Cbr\u003Eэто может очень сильно запутать пользователей . И еще , не предусмотрено способа вкладывать строчные элементы в такие пустые элементы , как \u003Cimg\u003E.\u003Cbr\u003E","\u003Cp\u003EHTML 5!!!\u003Cbr\u003E\u003Cp\u003EHTML 5 — это не продолжатель языка разметки гипертекста, а новая открытая платформа, предназначенная для создания веб-приложений использующих аудио, видео, графику, анимацию и многое другое.\u003Cbr\u003EУра, новые теги, облегчающие жизнь!!!\u003Cbr\u003E\u003Carticle\u003E \u003Caside\u003E \u003Caudio\u003E \u003Ccanvas\u003E \u003Ccommand\u003E \u003Cdatalist\u003E \u003Cdetails\u003E \u003Cfigcaption\u003E \u003Cfigure\u003E \u003Cfooter\u003E \u003Cheader\u003E \u003Chgroup\u003E \u003Ckeygen\u003E \u003Cmain\u003E \u003Cmark\u003E \u003Cmenu\u003E \u003Cmeter\u003E \u003Cnav\u003E \u003Coutput\u003E \u003Cprogress\u003E \u003Crp\u003E \u003Crt\u003E \u003Cruby\u003E \u003Csection\u003E \u003Csource\u003E \u003Csummary\u003E \u003Ctime\u003E \u003Cvideo\u003E \u003Cwbr\u003E\u003Cbr\u003E","\u003Cp\u003EHTML 5!!!\u003Cbr\u003E\u003Cp\u003EА это полезные теги, ориентированные на роботов, занимающихся интерпретацией текста, которые можно использовать вместо \u003Cdiv\u003E\u003Cbr\u003E\u003Carticle\u003E задает содержание сайта вроде новости, статьи, записи блога, форума или др.\u003Cbr\u003E\u003Caside\u003E определяет блок сбоку от контента для размещения рубрик, ссылок на архив, меток и другой информации. Такой блок, как правило, называется «сайдбар» или «боковая панель».\u003Cbr\u003E\u003Cfooter\u003E задаёт «подвал» сайта или раздела, в нём может располагается имя автора, дата документа, контактная и правовая информация.\u003Cbr\u003E\u003Cheader\u003E задает «шапку» сайта или раздела, в которой обычно располагается заголовок.\u003Cbr\u003E\u003Cnav\u003E задает навигацию по сайту. Если на странице несколько блоков ссылок, то в \u003Cnav\u003E обычно помещают приоритетные ссылки. Также допустимо использовать несколько тегов \u003Cnav\u003E в документе. \u003Cbr\u003E","\u003Cp\u003EHTML 5!!!\u003Cbr\u003E\u003Cp\u003EИ еще немного полезной информации\u003Cbr\u003E\u003C\u003Caudio\u003E - Добавляет, воспроизводит и управляет настройками аудиозаписи на веб-странице. Путь к файлу задается через атрибут src или вложенный тег \u003Csource\u003E. Внутри контейнера \u003Caudio\u003E можно написать текст, который будет выводиться в браузерах, не работающих с этим тегом.\u003Cbr\u003E\u003Caudio src=\"URL\"\u003E\u003C\u002Faudio\u003E \u003Cbr\u003E\u003Caudio\u003E \u003Csource src=\"URL\"\u003E \u003C\u002Faudio\u003E\u003Cbr\u003EАтрибуты\u003Cbr\u003Eautoplay - звук начинает играть сразу после загрузки страницы. сontrols - добавляет панель управления к аудиофайлу.\u003Cbr\u003Eloop - повторяет воспроизведение звука с начала после его завершения.\u003Cbr\u003Epreload - используется для загрузки файла вместе с загрузкой веб-страницы.\u003Cbr\u003Esrc - указывает путь к воспроизводимому файлу.\u003Cbr\u003E","\u003Cp\u003EHTML 5!!!\u003Cbr\u003E\u003Cp\u003EИ еще немного полезной информации\u003Cbr\u003E\u003Cvideo\u003E - Добавляет, воспроизводит и управляет настройками видеоролика на веб-странице. Путь к файлу задается через атрибут src или вложенный тег \u003Csource\u003E.\u003Cbr\u003E\u003C video src=\"URL\"\u003E\u003C\u002F video \u003E \u003Cbr\u003E\u003C video \u003E \u003Csource src=\"URL\"\u003E \u003C\u002F video \u003E\u003Cbr\u003EАтрибуты\u003Cbr\u003EAutoplay - видео начинает воспроизводиться автоматически после загрузки страницы. Controls - добавляет панель управления к видеоролику. Height - задает высоту области для воспроизведения видеоролика. Loop - повторяет воспроизведение видео с начала после его завершения. Poster - указывает адрес картинки, которая будет отображаться, пока видео не доступно или не воспроизводится. Preload - используется для загрузки видео вместе с загрузкой веб-страницы. Src - указывает путь к воспроизводимому видеоролику. Width - задает ширину области для воспроизведения видеоролика.\u003Cbr\u003E","\u003Cp\u003EHTML 5!!!\u003Cbr\u003E\u003Cp\u003EИ еще немного полезной информации\u003Cbr\u003E\u003C\u003Ccanvas\u003E - создает область, в которой при помощи JavaScript можно рисовать разные объекты, выводить изображения, трансформировать их и менять свойства. При помощи тега \u003Ccanvas\u003E можно создавать рисунки, анимацию, игры и др.\u003Cbr\u003E Атрибуты\u003Cbr\u003EHeight - Задает высоту холста. По умолчанию 300 пикселов.\u003Cbr\u003EWidth - Задает ширину холста. По умолчанию 150 пикселов.\u003Cbr\u003E","СПАСИБО ЗА ВНИМАНИЕ!!!\u003Cbr\u003EПолезные ссылки http:\u002F\u002Fhtmlbook.ru\u002F \u003Cbr\u003Ehttps:\u002F\u002Fwebref.ru\u002F \u003Cbr\u003E"],href:"\u002Finformatika\u002Fhtml-yazyk-gipertekstovoy-razmetki-2",href_category:"\u002Finformatika",date:1659508851,related:[{id:16634,name:"Социальные сети",href:"\u002Finformatika\u002Fsotsialnye-seti-4",jpg:"jpg\u002F16634"},{id:337031,name:"Pастровая и векторная графика",href:"\u002Finformatika\u002Fpastrovaya-i-vektornaya-grafika",jpg:"jpg\u002F337031"},{id:224588,name:"Подходы к понятию информации и измерения",href:"\u002Finformatika\u002Fpodhody-k-ponyatiyu-informatsii-i-izmereniya",jpg:"jpg\u002F224588"},{id:594150,name:"Програмування у Visual Studio",href:"\u002Finformatika\u002Fprogramuvannya-u-visual-studio",jpg:"jpg\u002F594150"},{id:7714,name:"Вирусқа қарсы программалар",href:"\u002Finformatika\u002Fvirusa-arsy-programmalar",jpg:"jpg\u002F7714"},{id:122882,name:"Деловой чат-бот",href:"\u002Finformatika\u002Fdelovoy-chat-bot",jpg:"jpg\u002F122882"},{id:423758,name:"B2B Кабинет. Покупки на сайте citilink.ru",href:"\u002Finformatika\u002Fb2b-kabinet-pokupki-na-sayte-citilinkru",jpg:"jpg\u002F423758"},{id:143246,name:"Бұлттық есептеулер және ұялы байланыс технологияларын интеграциялау",href:"\u002Finformatika\u002Fbltty-esepteuler-zhne-yaly-baylanys-tehnologiyalaryn-1",jpg:"jpg\u002F143246"},{id:438727,name:"Коммуникативная природа информационного общества",href:"\u002Finformatika\u002Fkommunikativnaya-priroda-informatsionnogo-obshchestva-7",jpg:"jpg\u002F438727"},{id:205270,name:"Электронная почта",href:"\u002Finformatika\u002Felektronnaya-pochta-11",jpg:"jpg\u002F205270"},{id:105602,name:"Создание пользовательской библиотеки компонентов. Прокладка трубопроводных и кабельных систем",href:"\u002Finformatika\u002Fsozdanie-polzovatelskoy-biblioteki-komponentov-prokladka-truboprovodnyh",jpg:"jpg\u002F105602"},{id:101529,name:"Информатика. Базовый курс",href:"\u002Finformatika\u002Finformatika-bazovyy-kurs",jpg:"jpg\u002F101529"},{id:345616,name:"Місце Юзабіліті в процесі розробки",href:"\u002Finformatika\u002Fmstse-yuzablt-v-protses-rozrobki",jpg:"jpg\u002F345616"},{id:202976,name:"Двовимірні масиви",href:"\u002Finformatika\u002Fdvovimrn-masivi",jpg:"jpg\u002F202976"},{id:397557,name:"Составные части ОС",href:"\u002Finformatika\u002Fsostavnye-chasti-os",jpg:"jpg\u002F397557"},{id:263514,name:"Инструкция по использованию Enhancesys",href:"\u002Finformatika\u002Finstruktsiya-po-ispolzovaniyu-enhancesys",jpg:"jpg\u002F263514"},{id:547975,name:"Свойства алгоритмов, презентация, 9 класс",href:"\u002Finformatika\u002Fsvoystva-algoritmov-prezentatsiya-9-klass",jpg:"jpg\u002F547975"},{id:167812,name:"Примеры программ на ЯП Паскаль. Часть 2",href:"\u002Finformatika\u002Fprimery-programm-na-yap-paskal-chast",jpg:"jpg\u002F167812"},{id:225327,name:"Экстремальное программирование (XP). Метафора",href:"\u002Finformatika\u002Fekstremalnoe-programmirovanie-xp-metafora",jpg:"jpg\u002F225327"},{id:571929,name:"Тренажёр Устройства компьютера",href:"\u002Finformatika\u002Ftrenazhyor-ustroystva-kompyutera",jpg:"jpg\u002F571929"},{id:102730,name:"СМИ. Введение в профессию. Второе занятие",href:"\u002Finformatika\u002Fsmi-vvedenie-v-professiyu-vtoroe-zanyatie",jpg:"jpg\u002F102730"},{id:381964,name:"Обработка информации",href:"\u002Finformatika\u002Fobrabotka-informatsii-9",jpg:"jpg\u002F381964"},{id:169910,name:"Алгебра высказываний. Логические выражения",href:"\u002Finformatika\u002Falgebra-vyskazyvaniy-logicheskie-vyrazheniya",jpg:"jpg\u002F169910"},{id:315440,name:"Путешествие по клавишам",href:"\u002Finformatika\u002Fputeshestvie-po-klavisham-1",jpg:"jpg\u002F315440"},{id:281695,name:"Структура и принципы построения сети интернет",href:"\u002Finformatika\u002Fstruktura-i-printsipy-postroeniya-seti-internet",jpg:"jpg\u002F281695"},{id:371715,name:"Средства модульного программирования",href:"\u002Finformatika\u002Fsredstva-modulnogo-programmirovaniya",jpg:"jpg\u002F371715"},{id:428849,name:"Продвижение сайтов",href:"\u002Finformatika\u002Fprodvizhenie-saytov-2",jpg:"jpg\u002F428849"},{id:378834,name:"Жиымдар. Бірөлшемді жиым",href:"\u002Finformatika\u002Fzhiymdar-brlshemd-zhiym",jpg:"jpg\u002F378834"}],navigation:{next:"\u002Ffizika\u002Fel-tok-v-metallah-deystvie-i",next_name:"Эл. ток в металлах. Действие и направление эл. тока 8 класс",prev:"\u002Fmedetsina\u002Fcomplete-blood-count-cbc",prev_name:"Complete blood count (CBC)"}}},categories:{result:[{id:I,ordering:b,name:"Без категории",pseudoname:"uncategorized"},{id:144,ordering:b,name:"Бизнес",pseudoname:"biznes"},{id:146,ordering:b,name:"Образование",pseudoname:"obrazovanie"},{id:149,ordering:b,name:"Финансы",pseudoname:"finansy"},{id:150,ordering:b,name:"Государство",pseudoname:"gosudarstvo"},{id:152,ordering:b,name:"Спорт",pseudoname:"sport"},{id:154,ordering:b,name:"Армия",pseudoname:"armiya"},{id:156,ordering:b,name:"Культурология",pseudoname:"kulturologiya"},{id:157,ordering:b,name:"Еда и кулинария",pseudoname:"eda-i-kulinariya"},{id:158,ordering:b,name:"Лингвистика",pseudoname:"lingvistika"},{id:163,ordering:b,name:"Черчение",pseudoname:"cherchenie"},{id:164,ordering:b,name:"Физкультура",pseudoname:"fizkultura"},{id:165,ordering:b,name:"ИЗО",pseudoname:"izo"},{id:166,ordering:b,name:"Психология",pseudoname:"psihologiya"},{id:116,ordering:I,name:"Английский язык",pseudoname:"angliyskiy-yazyk"},{id:108,ordering:2,name:"Астрономия",pseudoname:"astronomiya"},{id:104,ordering:3,name:"Алгебра",pseudoname:"algebra"},{id:106,ordering:4,name:"Биология",pseudoname:"biologiya"},{id:142,ordering:5,name:"География",pseudoname:"geografiya"},{id:141,ordering:6,name:"Геометрия",pseudoname:"geometria"},{id:123,ordering:7,name:"Детские презентации",pseudoname:"detskie-prezentatsii"},{id:107,ordering:8,name:G,pseudoname:"informatika"},{id:109,ordering:9,name:"История",pseudoname:"istoriya"},{id:139,ordering:10,name:"Литература",pseudoname:"literatura"},{id:119,ordering:11,name:"Маркетинг",pseudoname:"marketing"},{id:114,ordering:12,name:"Математика",pseudoname:"matematika"},{id:138,ordering:h,name:"Медицина",pseudoname:"medetsina"},{id:118,ordering:14,name:"Менеджмент",pseudoname:"menedzhment"},{id:137,ordering:15,name:"Музыка",pseudoname:"muzyka"},{id:136,ordering:16,name:"МХК",pseudoname:"mhk"},{id:130,ordering:17,name:"Немецкий язык",pseudoname:"nemetskiy-yazyk"},{id:105,ordering:18,name:"ОБЖ",pseudoname:"obzh"},{id:133,ordering:19,name:"Обществознание ",pseudoname:"obshchestvoznanie"},{id:132,ordering:20,name:"Окружающий мир ",pseudoname:"okruzhayushchiy-mir"},{id:131,ordering:21,name:"Педагогика ",pseudoname:"pedagogika"},{id:129,ordering:22,name:"Русский язык",pseudoname:"russkiy-yazyk"},{id:128,ordering:24,name:"Технология",pseudoname:"tehnologiya"},{id:127,ordering:25,name:"Физика",pseudoname:"fizika"},{id:126,ordering:26,name:"Философия",pseudoname:"filosofiya"},{id:125,ordering:H,name:"Химия",pseudoname:"himiya"},{id:124,ordering:29,name:"Экология",pseudoname:"ekologiya"},{id:121,ordering:30,name:"Экономика",pseudoname:"ekonomika"},{id:120,ordering:31,name:"Юриспруденция",pseudoname:"yurisprudentsiya"}]}},state:{},_errors:{},serverRendered:e,config:{public:{SITE_NAME:J,SITE_HOST:"mypreza.com",SITE_LANG:K,API_BASE_URL:"https:\u002F\u002Fmypreza.com\u002Fapi\u002F",pwaManifest:{name:J,short_name:a,description:a,lang:K,start_url:"\u002F?standalone=true",display:"standalone",background_color:j,theme_color:"#000000",icons:[{src:"\u002F_nuxt\u002Ficons\u002F64x64.f2a6e93d.png",type:d,sizes:L,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F64x64.maskable.f2a6e93d.png",type:d,sizes:L,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F120x120.f2a6e93d.png",type:d,sizes:M,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F120x120.maskable.f2a6e93d.png",type:d,sizes:M,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F144x144.f2a6e93d.png",type:d,sizes:N,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F144x144.maskable.f2a6e93d.png",type:d,sizes:N,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F152x152.f2a6e93d.png",type:d,sizes:O,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F152x152.maskable.f2a6e93d.png",type:d,sizes:O,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F192x192.f2a6e93d.png",type:d,sizes:P,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F192x192.maskable.f2a6e93d.png",type:d,sizes:P,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F384x384.f2a6e93d.png",type:d,sizes:Q,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F384x384.maskable.f2a6e93d.png",type:d,sizes:Q,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F512x512.f2a6e93d.png",type:d,sizes:R,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F512x512.maskable.f2a6e93d.png",type:d,sizes:R,purpose:g}]},yandexMetrika:{id:"85004146",metrikaUrl:"https:\u002F\u002Fmc.yandex.ru\u002Fmetrika\u002Ftag.js",accurateTrackBounce:e,childIframe:c,clickmap:c,defer:c,useRuntimeConfig:e,trackHash:c,trackLinks:e,type:b,webvisor:c,triggerEvent:c,consoleLog:e,partytown:c,isDev:c}},app:{baseURL:"\u002F",buildAssetsDir:"\u002F_nuxt\u002F",cdnURL:a}},pinia:{app:{meta:{h1:l,main_text:a,main_title:m,main_description:n,main_keywords:o,main_image:a},app:{logo_image:p,logo_image_width:q,logo_image_height:r,logo_text:a,image_width_full:s,image_width_min:t,recaptcha_key:u,yandex_search:v,ya_context:c,banner_1:a,banner_2:a,banner_3:a,banner_4:a,banner_5:a,banner_6:a,banner_7:a,banner_8:a,banner_9:a,banner_10:a,email:w,footer_before:a,footer:a,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:x,item_images:y,item_images_tag:z,item_words_h3:c,item_words_tag:A,item_words_1:h,routing:B,item_slide_skipping:C,item_download_timeout:D,item_slider_width:E,item_show_pdf:e,item_show_contents:e,item_show_filename:e},colors:{header_text:j,header_bg:i,accent:i}},social:F,token:a}}}}("",0,false,"image\u002Fpng",true,"any","maskable",13,"#d53032","#ffffff","HTML. Язык гипертекстовой разметки","Учебные презентации","Презентации в PowerPoint на разные темы","Презентации, проекты, доклады в PowerPoint на разные темы для учебы","Презентация, на тему, урок, класс, PowerPoint, скачати презентацію, фон, шаблон, доклад, проект.","images\u002Fdata\u002Flogo.png",185,40,720,480,"6LeioWIpAAAAAGqMN4KqMVIkekcMW7fBKHjXCd-a","2503267","[e-mail]","h3a","text","none","h3","category","both",80,800,"\u003Cscript src=\"\u002F\u002Fyastatic.net\u002Fes5-shims\u002F0.0.2\u002Fes5-shims.min.js\"\u003E\u003C\u002Fscript\u003E\r\n\u003Cscript src=\"\u002F\u002Fyastatic.net\u002Fshare2\u002Fshare.js\"\u003E\u003C\u002Fscript\u003E\r\n\u003Cdiv class=\"ya-share2\" data-services=\"collections,gplus,vkontakte,facebook,odnoklassniki,gplus,twitter,moimir\" data-counter=\"\"\u003E\u003C\u002Fdiv\u003E","Информатика",27,1,"Mypreza","ru","64x64","120x120","144x144","152x152","192x192","384x384","512x512"))</script><script type="module" src="/_nuxt/entry.0d6add34.js" crossorigin></script></body>
</html>