مقالة مقدمة من wulin.com (www.vevb.com): نظرة عامة على استخدام عناصر HTML5 HGROUP.
HGROUP هو عنصر محدد حديثًا في HTML5 يتم استخدامه لتجميع العناوين والترجمات. لماذا نحتاج إلى علامة <hgroup> إذا كان لدينا بالفعل علامة الرأس؟ فيما يلي إجابات لهذا السؤال
ما هو عنصر <hgroup>فيما يلي وصف لوصف المستند لـ <hgroup>:
تستخدم مجموعات HGROUPS بشكل عام كمجموعات من عناصر من H1 إلى H1 إلى H6 ، مثل العناوين داخل كتلة وترجماتها.
عادةً ما يتم استخدام عنصر HGROUP لتجميع مجموعة من عناصر H1-H6-إلى المجموعة ، على سبيل المثال ، عنوان القسم وبين العنوان الفرعي المصاحب.
مواصفات W3C
ماذا يعني هذا التعبير؟يلعب <HGROUP> دورًا يمكن أن يحتوي على حاويات واحدة أو أكثر ذات الصلة باللقب ، والتي قد تكون في عنصر & ls ؛ header>. يمكن أن يحتوي على عناصر العنوان فقط من H1-H6 ، والتي قد تكون ترجمات ، إما عناوين الاختيار ، أو عناوين العلامات.
طريقة أبسط لفهم كيفية استخدام <Hgroup> هي من خلال بعض الأمثلة. على سبيل المثال ، مثال Dr.oli التالي:
عندما يكون لعلامة المقالة ولها عنوان واحد فقط:
1
2
3
4
<article>
<H1> عنوان المقالة </h1>
<p> المحتوى ... </p>
</article>
عندما يكون لعلامة المقالة عنوان وتحتوي أيضًا على بيانات التعريف (Seameadata)
1
2
3
4
5
6
7
8
<!-العنوان الملتوي والبيانات الوصفية في الرأس->
<article>
<header>
<H1> عنوان المقالة </h1>
<p> (<time dateTime = 2009-07-13> 13th July ، 2009 </time>) </p>
</header>
<p> المحتوى ... </p>
</article>
عندما يكون لعلامة المقالة مجموعة من العناوين ذاتية الإرسال:
1
2
3
4
5
6
7
8
<!-العنوان H1 والترجم H2 في HGROUP->
<article>
<hgroup>
<H1> عنوان المقالة </h1>
<h2> المقالة الفرعية </h2>
</hgroup>
<p> المحتوى ... </p>
</article>
تحتوي علامة مقال على عنوان وترجمة وبيانات تعريف
1
2
3
4
5
6
7
8
9
10
11
<!-عنوان يستخدم الرأس و HGroup->
<article>
<header>
<hgroup>
<H1> عنوان المقالة </h1>
<h2> المقالة الفرعية </h2>
</hgroup>
<p> (<time dateTime = 2009-07-13> 13th July ، 2009 </time>) </p>
</header>
<p> المحتوى ... </p>
</article>
لماذا نستخدم <hgroup>؟نستخدم <hgroup> لبدء مخطط المستند (مخطط المستند).
عندما يكون عنوان المجموعة في عنصر <hgroup> ، ستقوم خوارزمية الخطوط العريضة بتكسير العنوان المنخفض المستوى في المجموعة وتستخدم العنوان الأعلى كمخطط تفصيلي. ما يلي مثال:
1
2
3
4
5
6
<header>
<hgroup>
<h1> <a href =/> mini apps </a> </h1>
<h2> تطبيقات الويب لـ iPhone و Android وغيرها من منصات المحمول </h2>
</hgroup>
</header>
يحتوي <HGROUP> على عناصر العنوان لـ H1-H2 ، ولكن يتم تضمين <H1> فقط في المخطط التفصيلي. كما هو مبين في الشكل أدناه.
يمكننا عرض مخطط المستند من هذا الرابط:
تلخيص:
ما تحدثنا عنه للتو هو كيفية استخدام عناصر <HGROUP> بكفاءة. دعونا نراجع:
إذا كان لديك عنصر عنوان واحد فقط (واحد في H1-H6) ، فلن تحتاج إلى <hgroup>.
. عندما يظهر واحد أو أكثر عناوين وعناصر ، يتم تطبيق <hgroup> لتطبيقها.
.
الأصلي الصيني: نظرة عامة على استخدام عناصر HTML5 HGROUP
اللغة الإنجليزية الأصلية: تجنب أخطاء HTML5 الشائعة