A HTML egyszerű szöveges fájl.htm (html) kiterjesztéssel. Az alkotáshoz a legegyszerűbb oldal eleinte, amikor éppen edz, csak egy notebook kell. Nyissa meg a jegyzettömböt, és írja be a szöveget.
Minden HTML elem egy címke, amelyet körülvesz<>zárójelben. Minden fájl, html oldal címkével kezdődik és a címkével végződik.
Itt a címke egyszerűen közli a böngészővel (amely az a program, amellyel az interneten böngészik), hogy ez a dokumentum egy html jelölődokumentum.
Címke - a html dokumentum elejét jelenti, és- záró tag, a html dokumentum végét jelenti.
Ezeken a címkéken belül számos más fontos címke is található. Közvetlenül a címke után vannak címkék, amelyek az oldal címét és az oldal törzsét jelentik.
Az első HTML oldalam
Címke
az ablak címének a címét jelenti, amikor ez az oldal megjelenik. <br>Most létrehozhat egy újat <a href="https://bar812.ru/hu/sozdanie-kompleksnyh-dokumentov-v-tekstovom-redaktore-ms-word.html">Szöveges dokumentum</a> Jegyzettömbben másold ki a fenti szöveget és mentsd el Oldal1.html néven és futtasd le a böngészőben, a böngészőablak címében látni fogod az oldal címét <title>, és egy üres oldal, mert a címkékben az oldal törzsében vagyunk <body> </body> nem adunk ki semmit.</p>
<p>Tehát a fenti szöveg minden weboldal alapkerete lesz számunkra.</p>
<h4><b>Párosított és párosítatlan címkék!</b></h4>
<p><html></html>, <head></head>,<body></body> Ezek csak párosított címkék – azok a címkék, amelyek egy címkepárként és annak záró, záró címkéjeként szerepelnek a / szimbólummal. Párosított címkék esetén a címke eleje és vége között lévő érték a címke művelete. A művelet addig terjed, amíg meg nem talál egy címkét a / karakterrel.</p>
<p>Párosítatlan címkék – nincs záró címkéjük. Az alábbiakban példákat adunk az ilyen címkékre.</p>
<p><head></head>- fejléc <a href="https://bar812.ru/hu/grafika-na-web-stranice-v-html-dobavlyaem-izobrazheniya-na-web-stranicu-a-eshche.html">html oldalak</a>, ami magában foglalja <a href="https://bar812.ru/hu/gugl-advords-sbor-klyuchevyh-slov-planirovshchik-klyuchevyh-slov-google-adwords.html">kulcsszavakat</a> keresők számára <a href="https://bar812.ru/hu/ustanovka-skriptov-v-razlichnye-brauzery-ustanovka-skriptov-v.html">különféle forgatókönyvek</a> stb.</p>
<p><body></body>- Közvetlenül a html dokumentum törzse.</p>
<p><br />Párosítatlan címke.</p>
<p><b>Jegyzet:</b> Az esetek többségében most, amikor a helyszíneket építik, kész rutinokat, beépülő modulokat stb. - többért <a href="https://bar812.ru/hu/metall-v-fotoshope-bystryi-sposob-sozdaniya-metallicheskogo.html">gyors alkotás</a> webhelyeken, de az ilyen rutinok és sablonok alkalmazásához és használatához továbbra is minimális ismeretekre van szükség ezekről a munkamenetekről.</p>
<p><b>Címke</b> (<i>pl. címkék, néha címkék</i>) egy elem <a href="https://bar812.ru/hu/rules-html-obshchie-pravila-shchity-zh2-pravila-yazyka-html-ispolzuite-sokrashch-nnye.html">HTML nyelv</a>, amely egy weboldal forrásszövegének megjelölésére szolgál. A címkék az angol szavak rövidítései vagy rövidítései, amelyek szögletes zárójelben vannak.<>pl címke <b><p>
</b>…<b></p>
</b> az angol szó rövidítése <span><i>bekezdés</i>, vagyis az ebbe a címkébe zárt szöveget a böngészők bekezdésként ismerik fel.</p>
<p>A HTML-ben minden címkének különleges jelentése van, és bizonyos adatok megjelenítéséért felelős. A címkenevekben a betűk kis- és nagybetűi nem számítanak, például a címke <b><p>
</b>…<b></p>
</b>és tag <b><P>
</b>…<b><b></P>
</b>
</b>- Ez ugyanaz. Vagyis a címkék írhatók kisbetűvel és <a href="https://bar812.ru/hu/propisnoi-shrift-css-delaem-zaglavnye-bukvy-css-stilyami-s.html">nagybetűvel</a>. Korábban általánosan elfogadott volt, hogy minden címkét nagybetűvel írnak, hogy a címkék eltérjenek a normál szövegtől. Most erre nincs szükség, mivel sok szerkesztő rendelkezik szintaktikai kiemeléssel.</p>
<h2>Címke besorolás</h2>
<p>A HTML-ben több mint 90 címke található. Általános szabály, hogy egy címke csak a dokumentum egy részét érinti, például az első szintű címsort. <h1>…</h1>. Ilyen esetekben páros címkéket használnak: <i>Nyítás</i>és <i>záró</i>. nyitócímke (pl. <b><h1>
</b>) létrehozza a hatást, és a záró ( <b></h1>
</b>) megszünteti. Amint a példából látható, a záró címkében mindig ez a karakter ( <b>/
</b>) egy perjel. Ezeket a címkéket hívják <i>párosítva</i>.</p>
<p>Néhány címkének egyszeri hatása van, ahol megjelennek. Például a vízszintes sáv címke <HR>vagy képmegjelenítési címkét <img>. Az ilyen címkéknek nincs végcímkéje. Az ilyen címkéket nem párosítottnak nevezzük.</p>
<h3>Címketípusok</h3>
<p>Ezenkívül a címkéket több típusra osztják, amelyek funkcióikban különböznek:</p>
<ul><li>Dokumentumcímcímkék;</li>
<li>blokk elemek;</li>
<li>inline elemek;</li>
<li>univerzális elemek;</li>
<li>listák;</li>
<li>asztalok;</li>
<li>keretek.</li>
</ul><p>Ez a felosztás nem szigorú, ezért egyes címkék különböző csoportokban találhatók. Például címkék listák létrehozásához <ol>és <ul>listákra és blokkelemekre egyaránt vonatkozik.</p>
<h2>Címkeszerkezet</h2>
<p>Böngészőbe töltve maguk a címkék nem jelennek meg, de befolyásolják a tartalmuk megjelenítését. Ha egy címkét hibásan írnak el, a rendszer teljes egészében figyelmen kívül hagyja.</p>
<p>Minden címkének van egy bizonyos szerkezete, amelyet íráskor figyelembe kell venni. Ezenkívül szinte minden címkének különféle attribútumai vannak, amelyek megváltoztathatják a tartalom megjelenítésének módját.</p>
<p>Nézzük meg az attribútumokat tartalmazó címkék helyes szerkezetét:</p>
<ol><li><b> <img src='/chto-takoe-parnye-tegi-tegi-v-html-odinarnye-i-parnye-tegi-kak.html' loading=lazy loading=lazy>
</b></li>
<li><b><a href=»сайт»>Maga Webmester</a>
</b></li>
</ol><p>Például két teljesen különböző címkét adtam. Az első <img>egyetlen - felelős a képek megjelenítéséért, attribútum - <b>src="logo.jpg"</b>. Második <a>…</a> a pár felelős a hivatkozások létrehozásáért, az attribútum az <b>href="webhely"</b>.</p>
<p><b>1. következtetés</b>: Az attribútumoknak lehetnek párosított és párosítatlan címkéi.</p>
<p><b>2. következtetés</b>: Az attribútumoknak csak kezdő címkéi lehetnek, a záró címkéknek nincsenek attribútumai.</p>
<p>Kép a pontosítás kedvéért:</p>
<p><img src='https://i0.wp.com/samsebewebmaster.ru/wp-content/uploads/2015/04/%D1%81%D1%82%D1%80%D1%83%D1%82%D1%83%D1%80%D0%B0-%D1%82%D0%B5%D0%B3%D0%B0-html.gif' width="100%" loading=lazy loading=lazy></p><p>1. ábra A html címke felépítése</p>
<h4>Feladat a figyelmességért és a HTML szintaxis ismeretéért</h4>
<p>Nézzünk egy példát egy egyszerű weboldalra, amelyet az oktatóanyagban megnéztünk.</p>
<p>Már olvastad, hogy az egész nyelv címkékből áll. Ebben az oktatóanyagban közelebbről megvizsgáljuk a HTML-címkéket. A HTML nyelvben a címkék egyedi (nem párosított) és párosított címkékre vannak osztva. Tehát az egyes HTML-címkék egy címkéből állnak, vagyis nincs záró címkéjük. És a páros leíróknak van nyitó és záró címkéje.</p>
<h2>Egyetlen HTML címkék</h2>
<p><b>Egyetlen címkék</b> nincs záró címkéjük. Például: <br> , <img>. Régen így írták: <br/> , <img src='/chto-takoe-parnye-tegi-tegi-v-html-odinarnye-i-parnye-tegi-kak.html' loading=lazy loading=lazy>, most nem releváns ez az egyedi címkék írásmódja, szóval ne írj így. Leggyakrabban használt egyedi címkék: <br>- átutalás ide <a href="https://bar812.ru/hu/nevernoe-kolichestvo-kategorii-v-ishodnoi-stroke-1s-novye-funkcii-raboty-so.html">új sor</a>, <hr>- az elválasztó vonal, <img>- kép beszúrása.</p>
<h2>Párosított HTML címkék</h2>
<p><b>Párosított címkék</b> sokkal több. A párleírónak van nyitó és záró címkéje. A páros címke egy tárolót alkot. A tároló tartalma az, ami a nyitó és záró címke között van. A cikk példájában látta a címkét <h1>Mik azok a címkék a HTML-ben?</h1>, tehát ez egy pár címke, ennek a címkenek a tartalma a "What are tags in HTML?" szöveg. Kezdete a címke <h1>, és a vége</h1> .</p>
<p><a href="https://bar812.ru/hu/na-glavnuyu-stranicu-vam-nuzhno-primery-tekstov-na-glavnuyu-stranicu-i.html">Fő hiba</a>újoncok a páros címkék írásában, ez egy beágyazási zavar. Például ez a helyes bejegyzés: <p><b>Félkövér bekezdés</b></p>. És itt a hiba: <p><b>Félkövér bekezdés</p></b>, az ilyen elrendezésű HTML-dokumentum nem tekinthető érvényesnek. Annak érdekében, hogy ne keverje össze a beágyazást, tegye ezt: hozzon létre páros címkéket, majd tegyen beléjük másokat, és a végén írjon szöveget mindkét címkébe <p><b>Hogyan írjunk helyesen párcímkéket</b></p> .</p>
<h2>Milyen újdonságok vannak a HTML5-ben a címkék terén?</h2>
<p><b>HTML5 nyelv</b> a HTML4 kiterjesztése, így a legtöbb vagy az összes címkét megtartotta a HTML4-ből, és hozzáadta a sajátját. A HTML5 speciális címkéket vezetett be, hogy a webhelyet fő blokkra bontsa: fejléc, menü, lábléc, oldalsáv és tartalom.</p>
<h2>Miért fontos megtanulni a címkék használatát?</h2>
<p>A Yandex és a Google keresőmotorok érzékenyek az elrendezésre <a href="https://bar812.ru/hu/na-etoi-stranice-proizoshla-oshibka-scenariya-kak-ustranit-oshibki.html">HTML dokumentumok</a> ellenőrizni azok érvényességét. Különleges leírókba zárt kulcsszavakat keresnek és így tovább. De ez a rész nem erről szól. Ez vonatkozik a promócióra (SEO).</p>
<h2>Hogyan lehet megtanulni az összes HTML címkét?</h2>
<p>Igen, sok címke van. De nem kell külön tanítani őket. Amíg gyakorolsz valami írást, az összes leírót, párosítva és egyenként, könnyen megjegyezheted. Idővel persze.</p>
<p><b>HTML címkék</b> a HTML nyelv alapja. A címkék az elemek elejét és végét elhatárolják a jelölésben.</p>
<p>Minden HTML dokumentum HTML elemekből és szövegekből álló fából áll. Minden HTML elemet egy kezdő (nyitó) és egy vég (záró) címke azonosít. A kezdő és záró címke tartalmazza a címke nevét.</p>
<p>Minden HTML elem öt típusra oszlik:</p>
<ul><li><b>üres elemek</b> — <area> , <base> , <br> , <col> , <embed> , <hr> , <img> , <input> , <link> , <menuitem> , <meta> , <param> , <source> , <track> , <wbr> ;</li>
<li><b>egyszerű szöveges elemek</b> — <script> , <style> ;</li>
<li><b>элементы, выводящие неформатированный текст
</b> — <textarea> , <title> ;</li>
<li><b>элементы из другого пространства имён
</b> — MathML и SVG;</li>
<li><b>обычные элементы
</b> — все остальные элементы.</li>
</ul><p>В таблице приведен полный список элементов, поддерживаемых HTML4 и HTML5. Экспериментальные и устаревшие теги исключены. Элементы, добавленные в спецификацию HTML5, выделены бирюзовым
цветом.</p>
<h2>Полный список HTML-элементов</h2>
<table class="t3">
Таблица 1. HTML-элементы
<tr><th style="width: 20%;">Тег
</th>
<th>Описание
</th>
</tr><tr><td> <!--...-->
</td>
<td>Используется для добавления комментариев.
</td>
</tr><tr><td> <!DOCTYPE>
</td>
<td>Объявляет тип документа и предоставляет основную информацию для браузера — его язык и версия.
</td>
</tr><tr><td> <a>
</td>
<td>Создаёт гипертекстовые ссылки.
</td>
</tr><tr><td> <abbr>
</td>
<td>Определяет текст как аббревиатуру или акроним. Поясняющий текст задаётся с помощью атрибута title .
</td>
</tr><tr><td> <address>
</td>
<td>Задает контактные данные автора/владельца документа или статьи. Отображается в браузере курсивом.
</td>
</tr><tr><td> <area>
</td>
<td>Представляет собой гиперссылку с текстом, соответствующей определенной области на карте-изображении или активную область внутри карты-изображения. Всегда вложен внутрь тега <map> .
</td>
</tr><tr><td> <article>
</td>
<td>Раздел контента, который образует независимую часть документа или сайта, например, статья в журнале, запись в блоге, комментарий.
</td>
</tr><tr><td> <aside>
</td>
<td>Представляет контент страницы, который имеет косвенное отношение к основному контенту страницы/сайта.
</td>
</tr><tr><td> <audio>
</td>
<td>Загружает звуковой контент на веб-страницу.
</td>
</tr><tr><td> <b>
</td>
<td>Задает полужирное начертание отрывка текста, не придавая акцент или важность выделенному.
</td>
</tr><tr><td> <base>
</td>
<td>Задает базовый адрес (URL), относительно которого вычисляются все относительные адреса. Это поможет избежать проблем при переносе страницы в другое место, так как все ссылки будут работать, как и прежде.
</td>
</tr><tr><td> <bdi>
</td>
<td>Изолирует отрывок текста, написанный на языке, в котором чтение текста происходит справа налево, от остального текста.
</td>
</tr><tr><td> <bdo>
</td>
<td>Отображает текст в направлении, указанном в атрибуте dir , переопределяя текущее направление написания текста.
</td>
</tr><tr><td> <blockquote>
</td>
<td>Выделяет текст как цитату, применяется для описания больших цитат.
</td>
</tr><tr><td> <body>
</td>
<td>Представляет тело документа (содержимое, не относящееся к метаданным документа).
</td>
</tr><tr><td> <br>
</td>
<td>Перенос текста на новую строку.
</td>
</tr><tr><td> <button>
</td>
<td>Создает интерактивную кнопку. Внутрь тега можно поместить содержимое — текст или изображение.
</td>
</tr><tr><td> <canvas>
</td>
<td>Холст-контейнер для динамического отображения изображений, таких как простые изображения, диаграммы, графики и т.п. Для рисования используется скриптовый язык JavaScript.
</td>
</tr><tr><td> <caption>
</td>
<td>Добавляет подпись к таблице. Вставляется сразу после тега <table> .
</td>
</tr><tr><td> <cite>
</td>
<td>Используется для указания источника цитирования. Отображается курсивом.
</td>
</tr><tr><td> <code>
</td>
<td>Представляет фрагмент программного кода, отображается шрифтом семейства monospace .
</td>
</tr><tr><td> <col>
</td>
<td>Выбирает для форматирования один или несколько столбцов таблицы, не содержащих информацию одного типа.
</td>
</tr><tr><td> <colgroup>
</td>
<td>Создает структурную группу столбцов, выделяющую множество логически однородных ячеек.
</td>
</tr><tr><td> <data>
</td>
<td>Элемент используется для связывания значения атрибута value , которое представлено в машиночитаемом формате и может быть обработано компьютером, с содержимым тега.
</td>
</tr><tr><td> <datalist>
</td>
<td>Элемент-контейнер для выпадающего списка элемента <input> . Варианты значений помещаются в элементы <option> .
</td>
</tr><tr><td> <dd>
</td>
<td>Используется для описания термина из тега <dt> .
</td>
</tr><tr><td> <del>
</td>
<td>Помечает текст как удаленный, перечёркивая его.
</td>
</tr><tr><td> <details>
</td>
<td>Создаёт интерактивный виджет, который пользователь может открыть или закрыть. Представляет собой контейнер для контента, видимый заголовок виджета помещается в тег <summary> .
</td>
</tr><tr><td> <dfn>
</td>
<td>Определяет слово как термин, выделяя его курсивом. Текст, идущий следом, должен содержать расшифровку этого термина.
</td>
</tr><tr><td> <dialog>
</td>
<td>Интерактивный элемент, с которым взаимодействует пользователь для выполнения задачи, например, диалоговое окно, инспектор или окно. Без атрибута open не виден для пользователя.
</td>
</tr><tr><td> <div>
</td>
<td>Тег-контейнер для разделов HTML-документа. Используется для группировки блочных элементов с целью форматирования стилями.
</td>
</tr><tr><td> <dl>
</td>
<td>Тег-контейнер, внутри которого находятся термин и его описание.
</td>
</tr><tr><td> <dt>
</td>
<td>Используется для задания термина.
</td>
</tr><tr><td> <em>
</td>
<td>Выделяет важные фрагменты текста, отображая их курсивом.
</td>
</tr><tr><td> <embed>
</td>
<td>Тег-контейнер для встраивания внешнего интерактивного контента или плагина.
</td>
</tr><tr><td> <fieldset>
</td>
<td>Группирует связанные элементы в форме, рисуя рамку вокруг них.
</td>
</tr><tr><td> <figcaption>
</td>
<td>Заголовок/подпись для элемента <figure> .
</td>
</tr><tr><td> <figure>
</td>
<td>Самодостаточный тег-контейнер для такого контента как иллюстрации, диаграммы, фотографии, примеры кода, обычно с подписью.
</td>
</tr><tr><td> <footer>
</td>
<td>Определяет завершающую область (нижний колонтитул) документа или раздела.
</td>
</tr><tr><td> <form>
</td>
<td>Форма для сбора и отправки на сервер информации от пользователей. Не работает без атрибута action .
</td>
</tr><tr><td> <h1-h6>
</td>
<td>Создают заголовки шести уровней для связанных с ними разделов.
</td>
</tr><tr><td> <head>
</td>
<td>Элемент-контейнер для метаданных HTML-документа, таких как <title> , <meta> , <script> , <link> , <style> .
</td>
</tr><tr><td> <header>
</td>
<td>Секция для вводной информации сайта или группы навигационных ссылок. Может содержать один или несколько заголовков, логотип, информацию об авторе.
</td>
</tr><tr><td> <hr>
</td>
<td>Горизонтальная линия для тематического разделения параграфов.
</td>
</tr><tr><td> <html>
</td>
<td>Корневой элемент HTML-документа. Сообщает браузеру, что это HTML-документ. Является контейнером для всех остальных html-элементов.
</td>
</tr><tr><td> <i>
</td>
<td>Выделяет отрывок текста курсивом, не придавая ему дополнительный акцент.
</td>
</tr><tr><td> <iframe>
</td>
<td>Создает встроенный фрейм, загружая в текущий HTML-документ другой документ.
</td>
</tr><tr><td> <img>
</td>
<td>Встраивает изображения в HTML-документ с помощью атрибута src , значением которого является адрес встраиваемого изображения.
</td>
</tr><tr><td> <input>
</td>
<td>Создает многофункциональные поля формы, в которые пользователь может вводить данные.
</td>
</tr><tr><td> <ins>
</td>
<td>Выделяет текст подчеркиванием. Применяется для выделения изменений, вносимых в документ.
</td>
</tr><tr><td> <kbd>
</td>
<td>Выделяет текст, который должен быть введён пользователем с клавиатуры, шрифтом семейства monospace.
</td>
</tr><tr><td> <meta>
</td>
<td>Используется для хранения дополнительной информации о странице. Эту информацию используют браузеры для обработки страницы, а поисковые системы — для ее индексации. В блоке <head> может быть несколько тегов <meta> , так как в зависимости от используемых атрибутов они несут разную информацию.
</td>
</tr><tr><td> <meter>
</td>
<td>Индикатор измерения в заданном диапазоне.
</td>
</tr><tr><td> <nav>
</td>
<td>Раздел документа, содержащий навигационные ссылки по сайту.
</td>
</tr><tr><td> <noscript>
</td>
<td>Определяет секцию, не поддерживающую сценарий (скрипт).
</td>
</tr><tr><td> <object>
</td>
<td>Контейнер для встраивания мультимедиа (например, аудио, видео, Java-апплеты, ActiveX, PDF и Flash). Также можно вставить другую веб-страницу в текущий HTML-документ. Для передачи параметров встраиваемого плагина используется тег <param> .
</td>
</tr><tr><td> <ol>
</td>
<td>Упорядоченный нумерованный список. Нумерация может быть числовая или алфавитная.
</td>
</tr><tr><td> <optgroup>
</td>
<td>Контейнер с заголовком для группы элементов <option> .
</td>
</tr><tr><td> <option>
</td>
<td>Определяет вариант/опцию для выбора в раскрывающемся списке <select> , <optgroup> или <datalist> .
</td>
</tr><tr><td> <output>
</td>
<td>Поле для вывода результата вычисления, рассчитанного с помощью скрипта.
</td>
</tr><tr><td> <p>
</td>
<td>Параграфы в тексте.
</td>
</tr><tr><td> <param>
</td>
<td>Определяет параметры для плагинов, встраиваемых с помощью элемента <object> .
</td>
</tr><tr><td> <picture>
</td>
<td>Элемент-контейнер, содержащий один элемент <img> и ноль или несколько элементов <source> . Сам по себе ничего не отображает. Дает возможность браузеру выбирать наиболее подходящее изображение.
</td>
</tr><tr><td> <pre>
</td>
<td>Выводит текст без форматирования, с сохранением пробелов и переносов текста. Может быть использован для отображения компьютерного кода, сообщения электронной почты и т.д.
</td>
</tr><tr><td> <progress>
</td>
<td>Индикатор выполнения задачи любого рода.
</td>
</tr><tr><td> <q>
</td>
<td>Определяет краткую цитату.
</td>
</tr><tr><td> <ruby>
</td>
<td>Контейнер для Восточно-Азиатских символов и их расшифровки.
</td>
</tr><tr><td> <rb>
</td>
<td>Определяет вложенный в него текст как базовый компонент аннотации.
</td>
</tr><tr><td> <rt>
</td>
<td>Добавляет краткую характеристику сверху или снизу от символов, заключенных в элементе <ruby> , выводится уменьшенным шрифтом.
</td>
</tr><tr><td> <rtc>
</td>
<td>Отмечает вложенный в него текст как дополнительную аннотацию.
</td>
</tr><tr><td> <rp>
</td>
<td>Выводит альтернативный текст в случае если браузер не поддерживает элемент <ruby>.
</td>
</tr><tr><td> <s>
</td>
<td>Отображает текст, не являющийся актуальным, перечеркнутым.
</td>
</tr><tr><td> <samp>
</td>
<td>Используется для вывода текста, представляющего результат выполнения программного кода или скрипта, а также системные сообщения. Отображается моноширинным шрифтом.
</td>
</tr><tr><td> <script>
</td>
<td>Используется для определения сценария на стороне клиента (обычно JavaScript). Содержит либо текст скрипта, либо указывает на внешний файл сценария с помощью атрибута src .
</td>
</tr><tr><td> <section>
</td>
<td>Определяет логическую область (раздел) страницы, обычно с заголовком.
</td>
</tr><tr><td> <select>
</td>
<td>Элемент управления, позволяющий выбирать значения из предложенного множества. Варианты значений помещаются в <option> .
</td>
</tr><tr><td> <small>
</td>
<td>Отображает текст шрифтом меньшего размера.
</td>
</tr><tr><td> <source>
</td>
<td>Указывает местоположение и тип альтернативных медиаресурсов для элементов <picture> , <video> , <audio> .
</td>
</tr><tr><td> <span>
</td>
<td>Контейнер для строчных элементов. Можно использовать для форматирования отрывков текста, например, выделения цветом отдельных слов.
</td>
</tr><tr><td> <strong>
</td>
<td>Расставляет акценты в тексте, выделяя полужирным.
</td>
</tr><tr><td> <style>
</td>
<td>Подключает встраиваемые таблицы стилей.
</td>
</tr><tr><td> <sub>
</td>
<td>Задает подстрочное написание символов, например, индекса элемента в химических формулах.
</td>
</tr><tr><td> <summary>
</td>
<td>Создаёт видимый заголовок для тега <details> . Отображается с закрашенным треугольником, кликнув по которому можно просмотреть подробности заголовка.
</td>
</tr><tr><td> <sup>
</td>
<td>Задает надстрочное написание символов.
</td>
</tr><tr><td> <table>
</td>
<td>Тег для создания таблицы.
</td>
</tr><tr><td> <tbody>
</td>
<td>Определяет тело таблицы.
</td>
</tr><tr><td> <td>
</td>
<td>Создает ячейку таблицы.
</td>
</tr><tr><td> <template>
</td>
<td>Используется для объявления фрагментов HTML-кода, которые могут быть клонированы и вставлены в документ скриптом. Содержимое тега не является его дочерним элементом.
</td>
</tr><tr><td> <textarea>
</td>
<td>Создает большие поля для ввода текста.
</td>
</tr><tr><td> <tfoot>
</td>
<td>Определяет нижний колонтитул таблицы.
</td>
</tr><tr><td> <th>
</td>
<td>Создает заголовок ячейки таблицы.
</td>
</tr><tr><td> <thead>
</td>
<td>Определяет заголовок таблицы.
</td>
</tr><tr><td> <time>
</td>
<td>Определяет дату/время.
</td>
</tr><tr><td> <title>
</td>
<td>Заголовок HTML-документа, отображаемый в верхней части строки заголовка браузера. Также может отображаться в результатах поиска, поэтому это следует принимать во внимание предоставление названия.
</td>
</tr><tr><td> <tr>
</td>
<td>Создает строку таблицы.
</td>
</tr><tr><td> <track>
</td>
<td>Добавляет субтитры для элементов <audio> и <video> .
</td>
</tr><tr><td> <u>
</td>
<td>Выделяет отрывок текста подчёркиванием, без дополнительного акцента.
</td>
</tr><tr><td> <ul>
</td>
<td>Создает маркированный список.
</td>
</tr><tr><td> <var>
</td>
<td>Выделяет переменные из программ, отображая их курсивом.
</td>
</tr><tr><td> <video>
</td>
<td>Добавляет на страницу видео-файлы. Поддерживает 3 видео формата: MP4, WebM, Ogg.
</td>
</tr><tr><td> <wbr>
</td>
<td>Указывает браузеру возможное место разрыва длинной строки.
</td>
</tr></table><h3>Таблица-шпаргалка с тегами</h3>
<p>Для удобства пользования я сгруппировала теги по тематическим разделам, добавив значения свойства display для каждого тега. Чтобы перейти к таблице, кликните по рисунку.</p>
<i>
</i><p>HTML элемент
- это основная структурная единица веб-страницы, написанная на языке HTML.</p>
<h2>Парные и одиночные теги HTML</h2>
<p>Синтаксис HTML элементов, состоящих из парных тегов:</p>
<ul><li>Элемент начинается с открывающего тега.</li>
<li>Элемент заканчивается закрывающим тегом.</li>
<li>Содержимым элемента является все, что находится между открывающим и закрывающим тегами. Содержимое может быть текстом и/или другим HTML элементом.</li>
</ul><p>Примечание:
не забывайте в закрывающем теге ставить символ "<b>/
</b>", он указывает браузеру, что ваш элемент закончился и что то, что будет написано после него, является уже другим элементом. Если не поставить символ "<b>/
</b>" в закрывающем теге, то браузер примет его за новый элемент, вложенный в предыдущий, который по мнению браузера всё ещё не закрыт.</p>
<p>Синтаксис HTML элементов, состоящих из одиночных тегов:</p>
<p><img src='https://i1.wp.com/puzzleweb.ru/images/teacher/html_elements2.png' height="212" width="237" loading=lazy loading=lazy></p>
<ul><li>Элемент состоит только из открывающего тега.</li>
</ul><p>Элементы, состоящие из одиночных тегов называются пустыми
. Всего в HTML 16 одиночных тегов:</p>
<table id="em_el"><tr><td style="width: 50%;">
</td>
<td>
</td>
</tr></table><h2>Вложенные элементы</h2>
<p>HTML элементы, состоящие из парных тегов, могут либо содержать в себе любые другие элементы, либо сами могут быть вложены в другие элементы, при этом глубина вложенности элементов не ограничена.</p>
<p>Следующий пример состоит из трех элементов, два из которых вложенные:</p><p>
<html>
<body>
<p>Мой первый абзац</p>
</body>
</html>
</p><p>Когда один элемент располагается внутри другого, нужно следить за тем, чтобы вложенный элемент начинался и заканчивался внутри одного и того же элемента. Так, например, следующий код является неверным:</p><p>
<p>Это <em>очень</p> интересно</em>
</p><p>Здесь элемент <em> выходит за пределы элемента
<p><img src='https://i1.wp.com/puzzleweb.ru/images/puzzleweb/nested2.png' height="90" width="171" loading=lazy loading=lazy></p>
<p>Пример с правильной вложенностью:</p><p>
<p>Это <em>очень</em> интересно</p>
</p><p>Здесь элемент <em> правильно вложен - он находится полностью в элементе
<p><img src='https://i1.wp.com/puzzleweb.ru/images/puzzleweb/nested1.png' height="79" width="162" loading=lazy loading=lazy></p>
<h2>Пробельные символы</h2>
<p>Браузер игнорирует пробельные символы в HTML-коде, поэтому их можно использовать с пользой для себя, придавая коду удобочитаемый вид. К пробельным символам относятся: символы табуляции, перенос строки и обычные пробелы, их можно использовать в любом количестве. Пример кода, в котором используются пробельные символы:</p><p>
<html>
<head>
<title>Заголовок
Мой первый заголовок
Мой первый абзац
