fix: converted single to triple backticks9 (#36236)
This commit is contained in:
Randell Dawson
Tom
@@ -81,52 +81,52 @@ The `<section>` و `<article>` العناصر متشابهة م
|
||||
1. تهدف المقالة إلى أن تكون قابلة للتوزيع أو القابلة لإعادة الاستخدام بشكل مستقل.
|
||||
2. القسم هو تجميع موضوعي للمحتوى.
|
||||
|
||||
`
|
||||
<section>
|
||||
<p>Top Stories</p>
|
||||
<section>
|
||||
<p>News</p>
|
||||
<article>Story 1</article>
|
||||
<article>Story 2</article>
|
||||
<article>Story 3</article>
|
||||
</section>
|
||||
<section>
|
||||
<p>Sport</p>
|
||||
<article>Story 1</article>
|
||||
<article>Story 2</article>
|
||||
<article>Story 3</article>
|
||||
</section>
|
||||
</section>
|
||||
`
|
||||
```html
|
||||
<section>
|
||||
<p>Top Stories</p>
|
||||
<section>
|
||||
<p>News</p>
|
||||
<article>Story 1</article>
|
||||
<article>Story 2</article>
|
||||
<article>Story 3</article>
|
||||
</section>
|
||||
<section>
|
||||
<p>Sport</p>
|
||||
<article>Story 1</article>
|
||||
<article>Story 2</article>
|
||||
<article>Story 3</article>
|
||||
</section>
|
||||
</section>
|
||||
```
|
||||
|
||||
#### `<header>` و `<hgroup>`
|
||||
|
||||
`<header>` عنصر موجود بشكل عام في أعلى مستند أو قسم أو مقالة ويحتوي عادةً على العنوان الرئيسي وبعض أدوات التنقل والبحث.
|
||||
|
||||
`
|
||||
<header>
|
||||
<h1>Company A</h1>
|
||||
<ul>
|
||||
<li><a href="/home">Home</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
<li><a href="/contact">Contact us</a></li>
|
||||
</ul>
|
||||
<form target="/search">
|
||||
<input name="q" type="search" />
|
||||
<input type="submit" />
|
||||
</form>
|
||||
</header>
|
||||
`
|
||||
```html
|
||||
<header>
|
||||
<h1>Company A</h1>
|
||||
<ul>
|
||||
<li><a href="/home">Home</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
<li><a href="/contact">Contact us</a></li>
|
||||
</ul>
|
||||
<form target="/search">
|
||||
<input name="q" type="search" />
|
||||
<input type="submit" />
|
||||
</form>
|
||||
</header>
|
||||
```
|
||||
|
||||
`<hgroup>` يجب استخدام عنصر حيث تريد عنوان رئيسي مع واحد أو أكثر من العناوين الفرعية.
|
||||
|
||||
`
|
||||
<hgroup>
|
||||
<h1>Heading 1</h1>
|
||||
<h2>Subheading 1</h2>
|
||||
<h2>Subheading 2</h2>
|
||||
</hgroup>
|
||||
`
|
||||
```html
|
||||
<hgroup>
|
||||
<h1>Heading 1</h1>
|
||||
<h2>Subheading 1</h2>
|
||||
<h2>Subheading 2</h2>
|
||||
</hgroup>
|
||||
```
|
||||
|
||||
تذكر ، أن رأس `<header>` عنصر يمكن أن يحتوي على أي محتوى ، ولكن `<hgroup>` لا يمكن أن يحتوي العنصر إلا على رؤوس أخرى ، وهي `<h1>` إلى `<h6>` بما في ذلك `<hgroup>` .
|
||||
|
||||
@@ -134,47 +134,47 @@ The `<section>` و `<article>` العناصر متشابهة م
|
||||
|
||||
The `<aside>` عنصر مخصص للمحتوى الذي ليس جزءًا من تدفق النص الذي يظهر فيه ، ومع ذلك لا يزال مرتبطًا بطريقة ما. هذا `<aside>` كشريط جانبي للمحتوى الرئيسي الخاص بك.
|
||||
|
||||
`
|
||||
<aside>
|
||||
<p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p>
|
||||
</aside>
|
||||
`
|
||||
```html
|
||||
<aside>
|
||||
<p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p>
|
||||
</aside>
|
||||
```
|
||||
|
||||
قبل HTML5 ، تم إنشاء قوائمنا باستخدام `<ul>` 's و `<li>` الصورة. الآن ، مع هذه ، يمكننا فصل عناصر القائمة لدينا باستخدام `<nav>` للتنقل بين صفحاتك. يمكنك الحصول على أي عدد من `<nav>` العناصر على الصفحة ، على سبيل المثال ، من الشائع أن يكون لديك نظام ملاحة عمومي عبر الجزء العلوي (في `<header>` ) والتنقل المحلي في شريط جانبي (في عنصر `<aside>` ).
|
||||
|
||||
`
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="/home">Home</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
<li><a href="/contact">Contact us</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
`
|
||||
```html
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="/home">Home</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
<li><a href="/contact">Contact us</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
```
|
||||
|
||||
#### `<footer>`
|
||||
|
||||
إذا كان هناك رأس `<header>` يجب أن يكون هناك `<footer>` . A `<footer>` بشكل عام في أسفل مستند أو قسم أو مقالة. تمامًا مثل `<header>` المحتوى عبارة عن معلومات عامة ، مثل تفاصيل المؤلف ، أو المعلومات القانونية ، و / أو روابط إلى المعلومات ذات الصلة. تسري أيضًا على تضمين `<section>` عناصر داخل تذييل الصفحة.
|
||||
|
||||
`
|
||||
<footer>©Company A</footer>
|
||||
`
|
||||
```html
|
||||
<footer>©Company A</footer>
|
||||
```
|
||||
|
||||
#### `<small>`
|
||||
|
||||
ال `<small>` يظهر العنصر غالبًا داخل `<footer>` أو `<aside>` العنصر الذي عادة ما يحتوي على معلومات حقوق الطبع والنشر أو التنازلات القانونية ، وغيرها من مثل هذه المطبوعة الجميلة. ومع ذلك ، هذا غير مخصص لجعل النص أصغر. إنه مجرد وصف محتواه ، وليس وصف العرض التقديمي.
|
||||
|
||||
`
|
||||
<footer><small>©Company A</small> Date</footer>
|
||||
`
|
||||
```html
|
||||
<footer><small>©Company A</small> Date</footer>
|
||||
```
|
||||
|
||||
#### `<time>`
|
||||
|
||||
The `<time>` يسمح عنصر لا لبس فيها ISO 8601 تاريخ لإرفاق نسخة الإنسان من ذلك التاريخ.
|
||||
|
||||
`
|
||||
<time datetime="2017-10-31T11:21:00+02:00">Tuesday, 31 October 2017</time>
|
||||
`
|
||||
```html
|
||||
<time datetime="2017-10-31T11:21:00+02:00">Tuesday, 31 October 2017</time>
|
||||
```
|
||||
|
||||
لماذا تهتم بـ `<time>` ؟ في حين يستطيع البشر قراءة الوقت الذي يمكن أن يفسد من خلال السياق بالطريقة العادية ، يمكن لأجهزة الكمبيوتر قراءة تاريخ ISO 8601 ورؤية التاريخ والوقت والمنطقة الزمنية.
|
||||
|
||||
@@ -182,12 +182,12 @@ The `<time>` يسمح عنصر لا لبس فيها ISO 8601 تاريخ
|
||||
|
||||
`<figure>` لتغليف محتوى الصور حوله ، و `<figcaption>` هو تسمية صورتك.
|
||||
|
||||
`
|
||||
<figure>
|
||||
<img src="https://en.wikipedia.org/wiki/File:Shadow_of_Mordor_cover_art.jpg" alt="Shadow of Mordor" />
|
||||
<figcaption>Cover art for Middle-earth: Shadow of Mordor</figcaption>
|
||||
</figure>
|
||||
`
|
||||
```html
|
||||
<figure>
|
||||
<img src="https://en.wikipedia.org/wiki/File:Shadow_of_Mordor_cover_art.jpg" alt="Shadow of Mordor" />
|
||||
<figcaption>Cover art for Middle-earth: Shadow of Mordor</figcaption>
|
||||
</figure>
|
||||
```
|
||||
|
||||
### تعرف على المزيد حول عناصر HTML5 الجديدة:
|
||||
|
||||
|
||||
Reference in New Issue
Block a user