Body head html: 11. Что означают теги HTML, HEAD, BODY? — Знакомство с HTML — codebra

Leave a Comment / Html / By /

HTML теги html, head, body — теги, которые есть на любой страничке интернета

Продолжаем рубрику «Создаем сайт с нуля», а в частности тему тегов… И сегодня мы рассмотрим теги, которые присутствуют в любой интернет-страничке — <html>, <head> и <body>. Есть еще один тег, который должен находиться в каждом HTML-документе и про который я уже писал в одной из предыдущих статей — тег-декларация <!DOCTYPE>, поэтому затрагивать его мы не будем.

В прошлых статьях рубрики я писал про создание пустого файла в формате html. Фактически, он был использован в статье про теги форматирования документа (именно в нем были применены теги заголовков). Теперь мы напрямую будем редактировать этот файл с полными описаниями.

И начнем статью именно с редактирования созданного файла. Лично я назвал его index.html, но имя может быть любым. Открываем его с помощью любого текстового редактора (лучше использовать Notepad++, так как в нем есть подсветка кода и другие полезные примочки). И сразу добавим в него теги <html>, <head> и <body> ровно в таком порядке, в каком они написаны.

Не забудьте их закрыть, как показано на скриншоте. Документ примет следующий вид:

А теперь рассмотрим значение каждого тега в отдельности. Не зря же они есть в каждом HTML-документе.

Содержание

  1. Функции тега <html>
  2. Функция тега <head>
  3. Функции тега <body>

Функции тега <html>

Итак, тег <html> является контейнерным (понятие и виды тегов). Внутри него заключается все видимое и невидимое содержимое веб-страницы (включая теги <head> и <body>). Открывающий тег <html> идет сразу после декларации Doctype, а закрывающий </html> стоит в конце документа. Тем самым, он дает понять браузеру, откуда начинать обработку документа и где ее заканчивать.

Теоретически, он и сам может понять что и как. Ведь что такое браузер? Это переводчик языка HTML и вряд ли он начнет обработку с середины документа и закончит ее, не дойдя до конца. Вопрос, конечно, спорный, но я всегда думал (и сейчас не отказываюсь от своего мнения) о том, что написание данного тега обязательно.

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

Единственное, что точно могу сказать — большинство атрибутов не поддерживаются HTML 4.01 или нежелательны. Хотя один пример все же приведу. Атрибут title — всплывающая подсказка в любом месте документа. Например, при наведении мыши на изображение вы можете увидеть всплывающий текст.

Также и в случае с этим тегом:

А вот что вы увидите, наведя курсор на документ с данным содержимым:

Предпочтительнее использовать атрибут title не в теге <html>, а в любых других конкретных участках страницы. Во-первых — удобно, во-вторых — поисковые системы лучше отнесутся к вашему сайту. Непосредственно на оптимизацию ресурса этот тег не оказывает. Идем далее.

Функция тега <head>

И следующим на очереди идет тег <head>. В нем содержится вся техническая информация о странице, которая служит для помощи браузеру и поисковым системам.

Тег является контейнерным и следует сразу после <html>, только в отличии от последнего, закрывающий тег </head> стоит не в конце документа, а перед открывающим тегом <body>.

Какую же информацию можно увидеть в <head>? А никакую. Все, что находится в пределах этого тега доступно для глаза человека только с помощью просмотра исходного кода страницы.

Все содержимое этого тега предназначено для поисковых систем и браузеров. Единственное, что вы хоть как-то можете увидеть это тег <title>, который отвечает за заголовок окна веб-страницы. Вот пример:

Текст после иконки и есть содержание тега <title>. А теперь рассмотрим содержание <head>, которое мы увидеть не можем, но которое является очень важной частью создания и продвижения сайта.  В первую очередь это строка

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Это мета-тег отвечающий за тип содержимого страницы (Content-Type). В данном случае, это html код в кодировке UTF-8 (content=»text/html; charset=UTF-8″). Далее идет тег title, описанный выше. Затем идут строки, начинающиеся с тега <link>. Он указывает на связь с внешним документом. Например, строка

<link href="https://monetavinternete.ru/.../style.css" rel="stylesheet" media="screen" type="text/css" />

указывает на то, что подключен (rel=»stylesheet») файл с каскадными таблицами стилей (type=»text/css»), который находится по такому-то адресу (для уменьшения длины строки, я заменил половин адреса на точки). После обработки данной строки браузером он определит, откуда брать каскадные таблицы стилей.

Вообще, в теге head много информации,о которой можно рассказывать бесконечно долго. Последнее, что стоит отметить (конкретно в случае с блогом на WordPress) — наличие тегов описания, ключевых слов и canonical. Я использую плагин All in One SEO Pack, поэтому они и присутствуют в пределах <head>.

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

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

Функции тега <body>

Вот он — основной тег интернет-страницы. Все, что вы видите в окне своего браузера — содержимое тега <body>. Здесь находится все: и текст, и html-код, и изображения, и скрипты. Так что много рассказывать про данный тег не буду. Из атрибутов могу отметить несколько:

  1. Background — устанавливает определенный фон на всю веб-страницу. Источник вы указываете сами
  2. text — устанавливает цвет текста. Цвет, обычно, указывают в html-коде. Например, #8958FC
  3. bgcolor — устанавливает цвет фона, если не задано фоновое изображение с помощью первого атрибута
  4. bgproperties — параметр динамичности фона — прокручивать его вместе со всей страницей, или же оставить на месте.

Атрибутов много, плюс подходят почти все универсальные, поэтому расписывать все нет смысла.

Один интересный факт. Все вы знаете, что браузеры появлялись версия за версией и каждый мог разбирать определенное количество тегов. Возьмем один из первых браузеров — Интернет Эксплорер.

Факт заключается в том, что в 1-ой версии поддерживался лишь <body>, во 2-ой — <html>, и, наконец, в 3-ей — <head>. Версии реализовывались довольно быстро, откуда можно сделать вывод о значимости тегов и скорости развития технологий.

Напоследок скажу, что не забывайте прописывать данные теги. Хотя сейчас каждая CMS — система управления контентом — делает это сама.

HTML/Элемент head

Синтаксис

HTML

XHTML

<html>
  <head>
    <title> ... </title>
    ...
  </head>
  <body> ... </body>
</html>

Описание

Элемент head (от англ. «head» ‒ «голова, заголовок») указывает голову документа (технический заголовок документа), в котором располагаются элементы технической информации (ссылки, стили, сценарии), а так же метатеги данных документа (описание страницы, ключевые слова). При этом всё содержимое данного элемента в поле страницы ни как не отображается.

Допустимые дочерние элементы: base, basefont, link, meta, script, style, title.

Поддержка браузерами

Chrome

Поддерж.

Firefox

Поддерж.

Opera

Поддерж.

Maxthon

Поддерж.

IExplorer

Поддерж.

Safari

Поддерж.

iOS

Поддерж.

Android

Поддерж.

Спецификация

Верс.Раздел
HTML
2.0Head: HEADПеревод
3.2The HEAD element
4.017.4.1 The HEAD element
DTD: Transitional Strict Frameset
5.04.2.1 The head element
5.14.2.1. The head element
XHTML
1. 0Extensible HyperText Markup Language
DTD: Transitional Strict Frameset
1.1Extensible HyperText Markup Language

Атрибуты

profile
Указывает URL-адрес документа содержащего набор правил для элемента meta.
Глобальные атрибуты
accesskey, class, contenteditable, contextmenu, data-*, dir, draggable, dropzone, hidden, id, inert, lang, spellcheck, style, tabindex, title, translate, xml:lang

Пример использования

Листинг кода

<!DOCTYPE html>
<html>
<head>
<meta charset=»utf-8″>
<title>Элемент head</title>
</head>
<body>
<h2>Пример с элементом «head»</h2>
<p>»Видимая часть страницы»</p>
</body>
</html>

Элемент head

Объясните значение тега и в HTML

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

Значение HTML-тега: Тег head в HTML используется для хранения метаданных или информации, относящейся к документу. Он содержит некоторые из наиболее важных тегов, таких как,<meta> и<link>.</p><p> <strong> С точки зрения браузера: </strong></p><ul><li> В HTML 5 не обязательно включать тег<head> в документ HTML, но в предыдущих версиях (4.0.1) он был обязательным.</li><li> Такие теги, как<title>,<meta> или<link>, которые обычно содержатся внутри заголовка, также будут нормально работать без тега<head> или вне тега<head>.</li></ul><p> <strong> С точки зрения разработки: </strong></p><ul><li> С точки зрения разработчика хорошо включать тег<head> в документ, поскольку этот синтаксис широко используется, а также обеспечивает хорошую структуру документа. Позже это поможет нам взаимодействовать с элементами DOM структурированным образом.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/image3.slideserve.com/6288320/latvar-php-l.jpg' /><noscript><img loading='lazy' src='/800/600/http/image3.slideserve.com/6288320/latvar-php-l.jpg' /></noscript></li></ul><p> <strong> Значение HTML-тега<body>: </strong> HTML-тег body является последним потомком тега<html>. Он используется для хранения основного содержимого HTML-документа. Он содержит все, от заголовка, абзацев до уникальных контейнеров <i> div </i>, находящихся внутри тега<body>.</p><p> <strong> С точки зрения браузера: </strong></p><ul><li> В HTML 5 не обязательно включать тег<body> в HTML-документ, но в предыдущих версиях (4.0.1) он был обязательным.</li><li> Такие теги, как<div>,<p> или <a>, которые обычно содержатся внутри body, также будут нормально работать без тега<body> или вне тега<body>.</li><li> Несмотря на то, что тег<body> не является обязательным, он имеет некоторые атрибуты, такие как background, bgcolor, a, link и т. д.</li></ul><p> <strong> С точки зрения разработки: </strong> С точки зрения разработчика Хорошо включить тег<body> внутри документа. Этот синтаксис широко используется, а также обеспечивает хорошую структуру документа. Позже это поможет нам взаимодействовать с элементами DOM структурированным образом.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/slideplayer.com/slide/6304819/21/images/13/Example+%3Chtml%3E+%3Cbody%3E.jpg' /><noscript><img loading='lazy' src='/800/600/http/slideplayer.com/slide/6304819/21/images/13/Example+%3Chtml%3E+%3Cbody%3E.jpg' /></noscript></p><p> <strong> Пример 1: </strong> В следующем коде отсутствуют теги<head> и<body>.</p><h3><span class="ez-toc-section" id="HTML"> HTML </span></h3><table border="0" cellpadding="0" cellspacing="0"><tbody><tr><td><p data-readability-styled="true"> <code> <!DOCTYPE html> </code></p><p data-readability-styled="true"> <code> < </code> <code> html </code> <code> > </code></p><p data-readability-styled="true"> <code>      </code> <code> < </code> <code> p </code> <code> > </code></p><p data-readability-styled="true"> <code>          </code> <code> Significance of 'head' и 'body'  </code></p><p data-readability-styled="true"> <code>          </code> <code> тег в HTML: Geeksforgeeks </code></p><p data-readability-styled="true"> <code>      </code> <code> </ </code> <code> p </code> <code> > </code></p><p data-readability-styled="true"> <code>   </code>  </p><p data-readability-styled="true"> <code>      </code> <code> < </code> <code> title </code> <code> >Tutorial</ </code> <code> title </code> <code> > </code></p><p data-readability-styled="true"> <code> </ </code> <code> html </code> <code> > </code></p></td></tr></tbody></table><p> <strong> Вывод: </strong></p><p> Без тегов head и body</p><p> <strong> Пример 2: </strong> Следующий код добавляет теги<head> и<body> в документ.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/fuzeservers.ru/wp-content/uploads/f/f/d/ffd8598e6f7197da8b2a814bf3331503.png' /><noscript><img loading='lazy' src='/800/600/http/fuzeservers.ru/wp-content/uploads/f/f/d/ffd8598e6f7197da8b2a814bf3331503.png' /></noscript> Вывод в последнем будет таким же, даже если включены теги<head> и<body>, но это дает лучшую структуру кода и лучшую перспективу для понимания.</p><h3><span class="ez-toc-section" id="HTML-2"> HTML </span></h3><table border="0" cellpadding="0" cellspacing="0"><tbody><tr><td><p data-readability-styled="true"> <code> <!DOCTYPE html> </code></p><p data-readability-styled="true"> <code> < </code> <code> html </code> <code> > </code></p><p data-readability-styled="true"> <code>   </code>  </p><p data-readability-styled="true"> <code> < </code> <code> head </code> <code> > </code></p><p data-readability-styled="true"> <code>      </code> <code> < </code> <code> title </code> <code> >Tutorial</ </code> <code> title </code> <code> > </code></p><p data-readability-styled="true"> <code> </ </code> <code> head </code> <code> > </code></p><p data-readability-styled="true"> <code> 3 </code>058 <code> < </code> <code> body </code> <code> > </code></p><p data-readability-styled="true"> <code>      </code> <code> < </code> <code> p </code> <code> > </code></p><p data-readability-styled="true"> <code>          </code> <code> Significance of 'head' and 'body' </code></p><p data-readability-styled="true"> <code>          </code> <code> tag in HTML : Geeksforgeeks </code></p><p data-readability-styled="true"> <code> </code> <code> </ </code> <code> P </code> <code>> </code></p><p data-readability-styled="true"> <code> </ </code> <code> Body </code> <code>> </code></p><p data-readability-styled="true"> <code> </code></p><p data-readability-styled="true"> </code></p><p data-readability-styled="true"> <code> </code></p><p data-readability-styled="true"> </code></p><p data-readability-styled="true"> <code> </code></p><p data-readability-styled="true"> </code></p>0059 </ </code> <code> html </code> <code> > </code></p></td></tr></tbody></table><p> <strong> Вывод: </strong></p><p> С тегами<head> и<body></p><p> Вывод не изменился.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/images.myshared.ru/7/816603/slide_13.jpg' /><noscript><img loading='lazy' src='/800/600/http/images.myshared.ru/7/816603/slide_13.jpg' /></noscript> Но код стал для нас понятным, так как соглашение соблюдается правильно.</p><p> <strong> Пример 3: </strong> В следующем коде используются атрибуты тега<body>. В этом примере мы собираемся использовать атрибут «bgcolor» тега<body>. Это изменит цвет фона всего документа. Без тега<body> мы потеряем больше таких атрибутов, как <alink>,<link> и т. д.</p><h3><span class="ez-toc-section" id="HTML-3"> HTML </span></h3><table border="0" cellpadding="0" cellspacing="0"><tbody><tr><td><p data-readability-styled="true"> <code> <!DOCTYPE html> </code></p><p data-readability-styled="true"> <code> < </code> <code> html </code> <code> > </code></p><p data-readability-styled="true"> <code>   </code>  </p><p data-readability-styled="true"> <code> < </code> <code> head </code> <code> > </code></p><p data-readability-styled="true"> <code>      </code> <code> < </code> <code> title </code> <code> >Tutorial</ </code> <code> title </code> <code> > </code></p><p data-readability-styled="true"> <code>      </code> <code> < </code> <code> ссылка </code> <code> rel <code>0 <code> = <code>"stylesheet" </code> <code> href </code> <code> = </code> <code> "styles.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/image1.slideserve.com/2766156/rnek-7-br-dey-m-l.jpg' /><noscript><img loading='lazy' src='/800/600/http/image1.slideserve.com/2766156/rnek-7-br-dey-m-l.jpg' /></noscript> css" </code> <code> > </code></p><p data-readability-styled="true"> <code> </ </code> <code> head </code> <code> > </code></p><p data-readability-styled="true"> <code>   </code>  </p><p data-readability-styled="true"> <code> < </code> <code> body </code> <code> bgcolor </code> <code> = </code> <code> "черный" </code> <code>> </code></p><p data-readability-styled="true"> <code> </code> <code> <</code> <code> H2 </code> <code>> </code></p><p data-readability-styled="true"> <code> </code> <code>0059          </code> <code> tag in HTML : Geeksforgeeks </code></p><p data-readability-styled="true"> <code>      </code> <code> </ </code> <code> h2 </code> <code> > </code></p><p data-readability-styled="true"> <code> </ </code> <code> body </code> <code> > </code></p><p data-readability-styled="true"> <code>   </code>  </p><p data-readability-styled="true"> <code> </ </code> <code> html </code> <code> > </code></p></td></tr></tbody></table><p> <strong> Вывод: </strong></p><p></p> <br/><h2><span class="ez-toc-section" id="_HTML-2"> Учебник по HTML.</span></h2><img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/slideplayer.biz.tr/slide/13124761/79/images/5/UYGULAMA+%3Chtml%3E+%3Chead%3E+%3C%2Fhead%3E+%3Cbody%3E.jpg' /><noscript><img loading='lazy' src='/800/600/http/slideplayer.biz.tr/slide/13124761/79/images/5/UYGULAMA+%3Chtml%3E+%3Chead%3E+%3C%2Fhead%3E+%3Cbody%3E.jpg' /></noscript> Элементы: body, head, title</h2><p>   » HTML  » Учебник по HTML — Элементы: тело, заголовок, заголовок</p><p> <strong> Элементы HTML </strong> имеют много рангов. Все, что вы видите: абзацы, баннер, навигационные ссылки слева и справа, все это элементы этой страницы.</p><p> Элемент состоит из трех частей: открывающего тега, содержимого элемента и закрытия.</p><ol><li> <strong><p> </strong> - тег, который открывает <strong> абзац </strong></li><li> Элемент <strong> содержимое </strong> - сам абзац.</li><li> <strong></p> </strong> - закрывающий тег.</li></ol><p> ***Примечание: <br/> Все веб-страницы будут иметь как минимум базовые элементы: <em><div id="yandex_rtb_4" class="yandex-adaptive classYandexRTB"></div> <script type="text/javascript">if(rtbW>=960){var rtbBlockID="R-A-744004-3";} else{var rtbBlockID="R-A-744004-5";} window.yaContextCb.push(()=>{Ya.Context.AdvManager.render({renderTo:"yandex_rtb_4",blockId:rtbBlockID,pageNumber:4,onError:(data)=>{var g=document.createElement("ins");g.className="adsbygoogle";g.style.display="inline";if(rtbW>=960){g.style.width="580px";g.style.height="400px";g.setAttribute("data-ad-slot","9935184599");}else{g.style.width="300px";g.style.height="600px";g.setAttribute("data-ad-slot","9935184599");} g.setAttribute("data-ad-client","ca-pub-1812626643144578");g.setAttribute("data-alternate-ad-url",stroke2);document.getElementById("yandex_rtb_4").appendChild(g);(adsbygoogle=window.adsbygoogle||[]).push({});}})});window.addEventListener("load",()=>{var ins=document.getElementById("yandex_rtb_4");if(ins.clientHeight =="0"){ins.innerHTML=stroke3;}},true);</script> <strong> html, заголовок, заголовок и тело </strong> </em> .</p><h3></h3><html> element</h3><p> HTML-документ всегда начинается с тега <em><html> </em> и заканчивается тегом <em></html> </em> . Это стандартная структура HTML. Пожалуйста, откройте Блокнот и скопируйте следующий код:</p><pre> html <code> <html> </html> </code> </pre><p> Сохраните документ из меню «Файл/Сохранить как».<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/luxe-host.ru/wp-content/uploads/4/9/a/49a2b5a4ee5623c9e004a67469aae8db.png' /><noscript><img loading='lazy' src='/800/600/http/luxe-host.ru/wp-content/uploads/4/9/a/49a2b5a4ee5623c9e004a67469aae8db.png' /></noscript> Выберите «Все файлы» и назовите новый созданный файл «9».0457 index.html </em> ". Нажмите "Сохранить". Теперь откройте файл в браузере, чтобы у вас была возможность обновить страницу (F5).</p><p> Если вы все сделали правильно, вы сможете увидеть свою веб-страницу белой !</p><h3></h3><head> element</h3><p> Следующим идет элемент <em><head> </em>. Пока вы помещаете его между <em> html </em> и <em> body </em>, все должно быть в порядке. нет видимой функции, поэтому мы поговорим об этом аспекте в следующих уроках, хотя я хочу упомянуть, что <em><center><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-1812626643144578" data-ad-slot="3076124593" data-ad-format="auto" data-full-width-responsive="true"></ins> <script>(adsbygoogle=window.adsbygoogle||[]).push({});</script></center><head> </em> может предложить браузеру очень полезную информацию. Вы можете ввести здесь другие коды, такие как JavaScript или CSS.</p><p> На данный момент оставим этот тег пустым и введем следующий элемент из списка, но сначала давайте посмотрим без него:</p><pre> html <code> <html> <голова> </голова> </html> </code> </pre><p> Если вы сохраните документ и попытаетесь обновить исходную страницу из браузера, вы не увидите никакой разницы. Просто имейте немного терпения, потому что далее мы будем изучать некоторые видимые элементы.<img class="lazy lazy-hidden" loading='lazy' src="//xn--90abhccf7b.xn--p1ai/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/mabi.vspu.ru/files/2013/10/dom2.png' /><noscript><img loading='lazy' src='/800/600/http/mabi.vspu.ru/files/2013/10/dom2.png' /></noscript></div></div></div></article><nav class="navigation post-navigation" aria-label="Записи"><h2 class="screen-reader-text">Навигация по записям</h2><div class="nav-links"><div class="nav-previous"><a href="https://xn--90abhccf7b.xn--p1ai/raznoe/menedzher-professii-chto-eto-za-professiya-i-kem-mozhno-rabotat.html" rel="prev">Менеджер профессии: что это за профессия и кем можно работать?</a></div><div class="nav-next"><a href="https://xn--90abhccf7b.xn--p1ai/raznoe/this-v-javascript-klyuchevoe-slovo-this-v-javascript-dlya-nachinayushhih-habr.html" rel="next">This в javascript: Ключевое слово this в JavaScript для начинающих / Хабр</a></div></div></nav><div id="comments" class="comments-area"><div id="respond" class="comment-respond"><h3 id="reply-title" class="comment-reply-title">Добавить комментарий <small><a rel="nofollow" id="cancel-comment-reply-link" href="/html/body-head-html-11-chto-oznachayut-tegi-html-head-body-znakomstvo-s-html-codebra.html#respond" style="display:none;">Отменить ответ</a></small></h3><form action="https://xn--90abhccf7b.xn--p1ai/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-notes"><span id="email-notes">Ваш адрес email не будет опубликован.</span> <span class="required-field-message">Обязательные поля помечены <span class="required">*</span></span></p><p class="comment-form-comment"><label for="comment">Комментарий <span class="required">*</span></label><textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required></textarea></p><p class="comment-form-author"><label for="author">Имя <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required /></p><p class="comment-form-email"><label for="email">Email <span class="required">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required /></p><p class="comment-form-url"><label for="url">Сайт</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" autocomplete="url" /></p><p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Отправить комментарий" /> <input type='hidden' name='comment_post_ID' value='68779' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /></p></form></div></div></main></div><div id="sidebar-primary" class="widget-area sidebar " role="complementary"><div class="sidebar-main"><div id="yandex_rtb_R-A-744004-7" class="yandex-adaptive classYandexRTB"></div> <script type="text/javascript"> window.yaContextCb.push(()=>{Ya.Context.AdvManager.render({renderTo: "yandex_rtb_R-A-744004-7",blockId: "R-A-744004-7",pageNumber: 11,onError: (data) => { var g = document.createElement("ins"); g.className = "adsbygoogle"; g.style.display = "inline"; g.style.width = "300px"; g.style.height = "600px"; g.setAttribute("data-ad-slot", "9935184599"); g.setAttribute("data-ad-client", "ca-pub-1812626643144578"); g.setAttribute("data-alternate-ad-url", "https://chajnov.ru/back.php"); document.getElementById("yandex_rtb_[rtbBlock]").appendChild(g); (adsbygoogle = window.adsbygoogle || []).push({}); }})}); window.addEventListener("load", () => { var ins = document.getElementById("yandex_rtb_R-A-744004-7"); if (ins.clientHeight == "0") { ins.innerHTML = stroke2; } }, true); </script><section id="search-2" class="widget widget_search"><div class="zita-widget-content"><form role="search" method="get" id="searchform" action="https://xn--90abhccf7b.xn--p1ai/"><div class="form-content"> <input type="text" placeholder="search.." name="s" id="s" value=""/> <input type="submit" value="Search" /></div></form></div></section><section id="nav_menu-4" class="widget widget_nav_menu"><div class="zita-widget-content"><h2 class="widget-title">Рубрики</h2><div class="menu-2-container"><ul id="menu-2" class="menu"><li id="menu-item-19021" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19021"><a href="https://xn--90abhccf7b.xn--p1ai/category/css">Css</a></li><li id="menu-item-19022" class="menu-item menu-item-type-taxonomy menu-item-object-category current-post-ancestor current-menu-parent current-post-parent menu-item-19022"><a href="https://xn--90abhccf7b.xn--p1ai/category/html">Html</a></li><li id="menu-item-19023" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19023"><a href="https://xn--90abhccf7b.xn--p1ai/category/js">Js</a></li><li id="menu-item-19024" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19024"><a href="https://xn--90abhccf7b.xn--p1ai/category/adaptiv">Адаптивный сайт</a></li><li id="menu-item-19025" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19025"><a href="https://xn--90abhccf7b.xn--p1ai/category/verstk">Верстка</a></li><li id="menu-item-19026" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19026"><a href="https://xn--90abhccf7b.xn--p1ai/category/idei">Идеи</a></li><li id="menu-item-19028" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19028"><a href="https://xn--90abhccf7b.xn--p1ai/category/chego-nachat">С чего начать</a></li><li id="menu-item-19029" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19029"><a href="https://xn--90abhccf7b.xn--p1ai/category/sovety">Советы</a></li><li id="menu-item-19031" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19031"><a href="https://xn--90abhccf7b.xn--p1ai/category/shablon">Шаблоны</a></li><li id="menu-item-19027" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-19027"><a href="https://xn--90abhccf7b.xn--p1ai/category/raznoe">Разное</a></li></ul></div></div></section></div></div></div></div><footer id="zita-footer"><div class="footer-wrap widget-area"><div class="bottom-footer"><div class="bottom-footer-bar ft-btm-one"><div class="container"><div class="bottom-footer-container"> © Компания <a href="http://вебджем.рф"> Вебджем.рф </a> 2009 - 2024 | Все права защищены.</a></div></div></div></div></div></footer> <noscript><style>.lazyload{display:none}</style></noscript><script data-noptimize="1">window.lazySizesConfig=window.lazySizesConfig||{};window.lazySizesConfig.loadMode=1;</script><script async data-noptimize="1" src='https://xn--90abhccf7b.xn--p1ai/wp-content/plugins/autoptimize/classes/external/js/lazysizes.min.js'></script> <!-- noptimize --> <style>iframe,object{width:100%;height:480px}img{max-width:100%}</style><script>new Image().src="//counter.yadro.ru/hit?r"+escape(document.referrer)+((typeof(screen)=="undefined")?"":";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+";"+Math.random();</script> <!-- /noptimize --> <script defer src="https://xn--90abhccf7b.xn--p1ai/wp-content/cache/autoptimize/js/autoptimize_b4a02ea7ab06cfcb8e144b512c939c55.js"></script></body></html>