الفرق بين المراجعتين لصفحة: «HTML/section»
< HTML
ط استبدال النص - ':(Content sectioning|Edits|Embedded content|Forms|Inline text semantics|Input Types|Interactive elements|Main Root|Metadata|Multimedia|Scripting|Table|Text Content)' ب':HTML $1' |
إضافة قسمين وتعديل الأمثلة |
||
(1 مراجعات متوسطة بواسطة نفس المستخدم غير معروضة) | |||
سطر 6: | سطر 6: | ||
هذه مثالٌ عن شيفرة قديمة تستعمل العنصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code> لتقسيم الصفحة:<code></code><syntaxhighlight lang="html"> | هذه مثالٌ عن شيفرة قديمة تستعمل العنصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code> لتقسيم الصفحة:<code></code><syntaxhighlight lang="html"> | ||
<div> | <div> | ||
<h1> | <h1>العنوان</h1> | ||
<p> | <p>المحتوى</p> | ||
</div> | </div> | ||
</syntaxhighlight>وإذا أردنا استخدام العنصر <code><section></code> فستبدو الشيفرة كما يلي:<syntaxhighlight lang="html"> | </syntaxhighlight>وإذا أردنا استخدام العنصر <code><section></code> فستبدو الشيفرة كما يلي:<syntaxhighlight lang="html"> | ||
<section> | <section> | ||
<h1> | <h1>العنوان</h1> | ||
<p> | <p>المحتوى</p> | ||
</section> | </section> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
== بطاقة العنصر == | |||
{| class="wikitable" style="width: 100%;" | {| class="wikitable" style="width: 100%;" | ||
|- | |- | ||
سطر 56: | سطر 57: | ||
* إذا كان من الممكن نشر محتوى عنصر <code><section></code> بشكل مستقل عن بقية المستند، فاستخدم العنصر <code>[[HTML/article|<article>]]</code> بدلًا منه. | * إذا كان من الممكن نشر محتوى عنصر <code><section></code> بشكل مستقل عن بقية المستند، فاستخدم العنصر <code>[[HTML/article|<article>]]</code> بدلًا منه. | ||
* لا تستعمل العنصر <code><section></code> كحاوية عامة وشاملة، فتلك وظيفة العنصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code>، خصوصًا إذا كان التقسيم لأغراض التنسيق. القاعدة العامة هي استخدام العنصر <code><section></code> عندما نريد أن يظهر قسمٌ جديد في تخطيط الصفحة. | * لا تستعمل العنصر <code><section></code> كحاوية عامة وشاملة، فتلك وظيفة العنصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code>، خصوصًا إذا كان التقسيم لأغراض التنسيق. القاعدة العامة هي استخدام العنصر <code><section></code> عندما نريد أن يظهر قسمٌ جديد في تخطيط الصفحة. | ||
== التنسيق الافتراضي == | |||
تعرض أغلبية المتصفحات العنصر <code><section></code> مع ضبط الخاصية <code>[[CSS/display|display]]</code> إلى <code>block</code>:<syntaxhighlight lang="css"> | |||
section { | |||
display: block; | |||
} | |||
</syntaxhighlight> | |||
==مصادر ومواصفات== | ==مصادر ومواصفات== | ||
سطر 61: | سطر 69: | ||
*مواصفة [https://www.w3.org/TR/2016/REC-html51-20161101/sections.html#the-section-element HTML 5.1]. | *مواصفة [https://www.w3.org/TR/2016/REC-html51-20161101/sections.html#the-section-element HTML 5.1]. | ||
*مواصفة [http://www.w3.org/TR/html5/sections.html#the-section-element HTML5]. | *مواصفة [http://www.w3.org/TR/html5/sections.html#the-section-element HTML5]. | ||
[[تصنيف:HTML]] | [[تصنيف:HTML|{{SUBPAGENAME}}]] | ||
[[تصنيف:HTML Elements]] | [[تصنيف:HTML Elements|{{SUBPAGENAME}}]] | ||
[[تصنيف:HTML Content sectioning]] | [[تصنيف:HTML Content sectioning|{{SUBPAGENAME}}]] |
المراجعة الحالية بتاريخ 04:21، 18 فبراير 2018
يُمثِّل العنصر <section>
قسمًا مستقلًا له وظيفة خاصة به ضمن مستند HTML، ويكون له ترويسة عادةً، وهذا القسم ليس له وسمٌ خاصٌ يمكن أن يمثِّله.
فمثلًا يمكن وضع روابط التنقل ضمن عنصر <nav>
، لكن قائمةً بنتائج البحث أو خريطة مع عناصر التحكم الخاصة بها لا تملك عناصر HTML محدَّدة، لذا يمكن وضعها ضمن عنصر <section>
.
هذه مثالٌ عن شيفرة قديمة تستعمل العنصر <div>
لتقسيم الصفحة:
<div>
<h1>العنوان</h1>
<p>المحتوى</p>
</div>
وإذا أردنا استخدام العنصر <section>
فستبدو الشيفرة كما يلي:
<section>
<h1>العنوان</h1>
<p>المحتوى</p>
</section>
بطاقة العنصر
تصنيفات المحتوى | عنصر تنظيمي. |
---|---|
المحتوى المسموح | محتوى تنظيمي. |
الوسم المختصر | لا يمكن حذف أيّ من وسمَي البداية أو النهاية. |
العناصر الأب | أي عنصر يقبل المحتوى التنظيمي.
لاحظ أنَّ العنصر |
واجهة DOM | HTMLElement
|
دعم المتصفحات
Chrome | Firefox | Edge | Safari | Opera |
---|---|---|---|---|
5 | 4 | مدعوم | 4.1 | 11.10 |
الخاصيات
يمكن استخدام الخاصيات العامة في هذا العنصر.
ملاحظات الاستخدام
- يجب أن يكون كل عنصر
<section>
مُعرَّفًا (identified)، ويتم ذلك عمومًا بتضمين ترويسة (العناصر<h1>-<h6>
) ضمن العنصر<section>
. - إذا كان من الممكن نشر محتوى عنصر
<section>
بشكل مستقل عن بقية المستند، فاستخدم العنصر<article>
بدلًا منه. - لا تستعمل العنصر
<section>
كحاوية عامة وشاملة، فتلك وظيفة العنصر<div>
، خصوصًا إذا كان التقسيم لأغراض التنسيق. القاعدة العامة هي استخدام العنصر<section>
عندما نريد أن يظهر قسمٌ جديد في تخطيط الصفحة.
التنسيق الافتراضي
تعرض أغلبية المتصفحات العنصر <section>
مع ضبط الخاصية display
إلى block
:
section {
display: block;
}
مصادر ومواصفات
- معيار HTML Living Standard.
- مواصفة HTML 5.1.
- مواصفة HTML5.