diff options
Diffstat (limited to 'files/bg/web/html/element/main/index.html')
-rw-r--r-- | files/bg/web/html/element/main/index.html | 140 |
1 files changed, 140 insertions, 0 deletions
diff --git a/files/bg/web/html/element/main/index.html b/files/bg/web/html/element/main/index.html new file mode 100644 index 0000000000..3594afe2b5 --- /dev/null +++ b/files/bg/web/html/element/main/index.html @@ -0,0 +1,140 @@ +--- +title: <main> +slug: Web/HTML/Element/main +tags: + - HTML + - HTML групиране на съдържанието + - main + - Елемент + - референция +translation_of: Web/HTML/Element/main +--- +<div>{{HTMLRef}}</div> + +<div><strong>HTML елементът <code><main></code> </strong> представя основното съдържание на частта {{HTMLElement("body")}} на документа, на негова част или на приложението. Тази зона, предназначена за основното съдържание, се състои от информация, която е пряко свързана с главната тема на документа или основната функционалност на приложението, или пък я допълва. Ако е необходимо, бихте могли да използвате няколко <code><main></code> елемента в една и съща страница. Например, когато имате страница, която презентира няколко статии - всяка от които в собствен {{HTMLElement("article")}} елемент и всяка една от тях има допълнителни материали в себе си (като лента с инструменти за обработка, реклами и т.н.). В такъв случай, има смисъл да включите <code><main></code> елемент във всяка една статия, за да можете да обособите водещото съдържание за всяка конкретна статия.</div> + +<table class="properties"> + <tbody> + <tr> + <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Content categories</a></th> + <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>, palpable content.</td> + </tr> + <tr> + <th scope="row">Permitted content</th> + <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>.</td> + </tr> + <tr> + <th scope="row">Tag omission</th> + <td>None; both the starting and ending tags are mandatory.</td> + </tr> + <tr> + <th scope="row">Permitted parents</th> + <td>Any element that accepts <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">flow content</a> (WHATWG). However, the W3C specification doesn't permit <code><main></code> to be used as a descendant of {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, or {{HTMLElement("nav")}}.</td> + </tr> + <tr> + <th scope="row">Permitted ARIA roles</th> + <td>The <code>main</code> role is applied to <code><main></code> by default, and the <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_presentation_role">presentation</a></code> role is permitted as well.</td> + </tr> + <tr> + <th scope="row">DOM interface</th> + <td>{{domxref("HTMLElement")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Атрибути">Атрибути</h2> + +<p>Този елемент може да съдържа само глобалните атрибути (<a href="/en-US/docs/HTML/Global_attributes">global attributes</a>).</p> + +<h2 id="Бележки_за_употребата">Бележки за употребата</h2> + +<p>Съдържанието на елемента <code><main></code> трябва да бъде уникално за документа или за частта, която го съдържа. Съдържание, което е повтарящо се през съответния набор от документи или частите на документа като: странични ленти, линкове за навигация, информация за правата, лога на сайта и форми за търсене не бива да са включени, освен ако формата за търсене не е основната функционалност на страницата.</p> + +<p><code><main></code> не допринася за схемата на документа. За разлика от елементи като {{HTMLElement("body")}}, заглавия {{HTMLElement("h2")}}, и други, <code><main></code> не влияе на DOM концепцията за структуриране на страницата. Функцията на този елемент е стриктно информативна.</p> + +<h3 id="Разлики_между_WHATWG_и_W3C_спецификациите">Разлики между WHATWG и W3C спецификациите</h3> + +<p>Дефиницията на елемента <code><main></code> е значително различна между стандарта <a href="https://html.spec.whatwg.org/multipage/grouping-content.html#the-main-element">WHATWG's living standard </a>(спецификациите, които MDN по споразумение) и <a href="https://w3c.github.io/html/grouping-content.html#the-main-element">the W3C specification</a>. Ето разликите между двете спецификации по примерите, дадени по-горе:</p> + +<ul> + <li>Стандартът за HTML WHATWG позволява няколко елемента <code><main></code> на една страница, докато версията на <a href="https://www.w3.org/TR/html/grouping-content.html#the-main-element">the W3C version of the specification</a> не позволява. Прави изключение случаят в който освен един, всички останали елементи <code><main></code> са скрити посредством атрибута {{htmlattrxref("hidden")}}.</li> + <li>Спецификацията WHATWG разрешава <code><main></code>да бъде използван навсякъде, където е позволено да има <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Flow_content">flow content</a> . Противно на това, версията на W3C не позволява <code><main></code> да е вложен в {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}} или {{HTMLElement("nav")}}.</li> +</ul> + +<p>Изглеждат много малко разликите, но елементът <code><main></code> е сравнително прост на функционално ниво. Ако се игнорират тези разлики, то те биха могли да доведат до значителни последици.</p> + +<h2 id="Пример">Пример</h2> + +<pre class="brush: html"><!-- other content --> + +<main> + <h1>Apples</h1> + <p>The apple is the pomaceous fruit of the apple tree.</p> + + <article> + <h2>Red Delicious</h2> + <p>These bright red apples are the most common found in many + supermarkets.</p> + <p>... </p> + <p>... </p> + </article> + + <article> + <h2>Granny Smith</h2> + <p>These juicy, green apples make a great filling for + apple pies.</p> + <p>... </p> + <p>... </p> + </article> +</main> + +<!-- other content --></pre> + +<h2 id="Спецификации">Спецификации</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Спецификация</th> + <th scope="col">Статус</th> + <th scope="col">Коментар</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', '#semantics.html#the-main-element', '<main>')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Премахва органичението <code><main></code> да не бъде използван няколко пъти в документ или като вложен в елемента {{HTMLElement("article")}}.</td> + </tr> + <tr> + <td>{{SpecName('HTML5.1', 'grouping-content.html#the-main-element', '<main>')}}</td> + <td>{{Spec2('HTML5.1')}}</td> + <td>Без промяна от {{SpecName('HTML5 W3C')}}.</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-main-element', '<main>')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Съвместимост_с_браузърите">Съвместимост с браузърите</h2> + +<p>Елементът <code><main></code> е широко поддържан. За Internet Explorer 11 и надолу, е препоръчително да се добави ARIA role of <code>"main"</code> kym elementa <code><main></code> , за да се подсигурите, че е достъпен(екранни четци като JAWS, използвани със стари версии на Internet Explorer, ще могат да разберат семантичното значение на елемента <code><main></code>, когато този атрибут <code>role</code> бъде добавен).</p> + +<pre class="brush: html"><main role="main"> + ... +</main> +</pre> + + + +<p>{{Compat("html.elements.main")}}</p> + +<h2 id="Виж_също">Виж също</h2> + +<ul> + <li>Основни структурни елементи: {{HTMLElement("html")}}, {{HTMLElement("head")}}, {{HTMLElement("body")}}</li> + <li>Елеемнти, оказващи отделните части: {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, or {{HTMLElement("nav")}}</li> +</ul> |