From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/ar/html/element/article/index.html | 153 +++++++++++++++++++++++++++++++ 1 file changed, 153 insertions(+) create mode 100644 files/ar/html/element/article/index.html (limited to 'files/ar/html/element/article/index.html') diff --git a/files/ar/html/element/article/index.html b/files/ar/html/element/article/index.html new file mode 100644 index 0000000000..4ffbdbe80a --- /dev/null +++ b/files/ar/html/element/article/index.html @@ -0,0 +1,153 @@ +--- +title: عنصر المقالة
+slug: HTML/Element/article +translation_of: Web/HTML/Element/article +--- +
{{HTMLRef}}
+ +

عنصر الـ <article> الموجود في الـ html فهو مفهوم من عنوانه والذي يعني (مقال) ونعرف جميعنا ان المقالات بنية مستقلة بذاتها. وتوجد في الوثائق, الصفحات, التطبيقات او المواقع. ما نتحدث عنه اليوم هو كيف نكتب عناصر الـ html لصفحة تحتوي على مقالات مثل : منشور المنتديات, مقالات الصفحات و المجلات. حتى منشورات المدونات blogs تعتبر مقالة. 

+ +

في حالة اردت ان تبرمج صفحة تختص بالمقالات لابد لك ان تقوم باستخدام تاك او عنصر <article>. المثال التالي يوضع استخدام المقالة بابسط صوره لها: 

+ +
{{EmbedInteractiveExample("pages/tabbed/article.html", "tabbed-standard")}}
+ +
+ + + +

يمكن لصفحة الواحدة ان تحتوي على الكثير من المقالات. وهذا المثال دليل على ذلك. ليس هذا فحسب, فيمكن ان يكون عنصر المقالة يحتوي على عناصر مقالة بداخله ( تسمى nested element اي العناصر المتداخلة ).

+ +

اليك معلومات خاطفة عن هذا العنصر:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
فئة المكون +

Flow content, sectioning content, palpable content

+
Permitted contentFlow content.
Tag omission{{no_tag_omission}}
Permitted parentsAny element that accepts flow content. Note that an <article> element must not be a descendant of an {{HTMLElement("address")}} element.
Implicit ARIA rolearticle
Permitted ARIA roles{{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("feed")}}, {{ARIARole("main")}}, {{ARIARole("none")}}, {{ARIARole("presentation")}}, {{ARIARole("region")}}
DOM interface{{domxref("HTMLElement")}}
+ +

الخصائص

+ +

هذا العنصر يحتوي على الخصائص العامة فقط. يمكنك زيارتها من هنا

+ +

ملاحظات الاستخدام

+ +

انت حر في استخدام هذا العنصر. ولكننا نفضل ان تقوم بمراعات هذه النقاط على الاقل.

+ + + +

المثال التالي يلخص لك هذه النقاط:

+ +
<article class="film_review">
+  <header>
+    <h2>Jurassic Park</h2>
+  </header>
+  <section class="main_review">
+    <p>Dinos were great!</p>
+  </section>
+  <section class="user_reviews">
+    <article class="user_review">
+      <p>Way too scary for me.</p>
+      <footer>
+        <p>
+          Posted on
+          <time datetime="2015-05-16 19:00">May 16</time>
+          by Lisa.
+        </p>
+      </footer>
+    </article>
+    <article class="user_review">
+      <p>I agree, dinos are my favorite.</p>
+      <footer>
+        <p>
+          Posted on
+          <time datetime="2015-05-17 19:00">May 17</time>
+          by Tom.
+        </p>
+      </footer>
+    </article>
+  </section>
+  <footer>
+    <p>
+      Posted on
+      <time datetime="2015-05-15 19:00">May 15</time>
+      by Staff.
+    </p>
+  </footer>
+</article>
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', 'semantics.html#the-article-element', '<article>')}}{{Spec2('HTML WHATWG')}}
{{SpecName('HTML5.1', 'sections.html#the-article-element', '<article>')}}{{Spec2('HTML5.1')}}
{{SpecName('HTML5 W3C', 'sections.html#the-article-element', '<article>')}}{{Spec2('HTML5 W3C')}}
+ +

Browser compatibility

+ + + +

{{Compat("html.elements.article")}}

+ +

يمكنك زيارة التالي:

+ + -- cgit v1.2.3-54-g00ecf