gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improve translations/code block fix (#36964)

Browse Source
This commit is contained in:
Khalid Almufti
2020-01-21 07:30:56 -06:00
committed by Ahmad Abdolsaheb
parent bcaec00958
commit 3cc810e387
1 changed files with 13 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
curriculum/challenges/arabic/01-responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element.arabic.md
View File

@ -7,7 +7,19 @@ localeTitle: تحسين إمكانية الوصول المخطط مع عنصر
---
## Description
<section id="description"> قدم HTML5 عنصر <code>figure</code> ، جنبا إلى جنب مع <code>figcaption</code> ذات الصلة. تستخدم هذه العناصر معًا لتمثيل عرض مرئي (مثل صورة أو مخطط أو مخطط) مع التسمية التوضيحية. ويعطي هذا دفعة من إمكانية الوصول ذات شقين عن طريق كل من المحتوى ذي الصلة من حيث تجميع المحتوى ، وتقديم بديل نصي يشرح <code>figure</code> . بالنسبة إلى عمليات التمثيل البصري للبيانات مثل المخططات ، يمكن استخدام التسمية التوضيحية للإحاطة علما بالاتجاهات أو الاستنتاجات للمستخدمين الذين يعانون من إعاقات بصرية. ويغطي تحد آخر كيفية نقل إصدار جدول من البيانات خارج الشاشة (باستخدام CSS) لمستخدمي قارئ الشاشة. في ما يلي مثال - لاحظ أن <code>figcaption</code> داخل علامات <code>figure</code> ويمكن دمجه مع عناصر أخرى: <blockquote style=";text-align:right;direction:rtl"> &lt;الرقم&gt; <br> &lt;img src = &quot;roundhouseDestruction.jpeg&quot; alt = &quot;Photo of Camper Cat executing a roundhouse kick&quot;&gt; <br> &lt;BR&gt; <br> &lt;figcaption&gt; <br> يوضح سيد كامبر القط شكل مناسب للركلة المستديرة. <br> &lt;/ figcaption&gt; <br> &lt;/ الرقم&gt; <br></blockquote></section>
<section id="description"> قدم HTML5 عنصر <code>figure</code> ، جنبا إلى جنب مع <code>figcaption</code> ذات الصلة. تستخدم هذه العناصر معًا لتمثيل عرض مرئي (مثل صورة أو مخطط أو مخطط) مع التسمية التوضيحية. ويعطي هذا دفعة من إمكانية الوصول ذات شقين عن طريق كل من المحتوى ذي الصلة من حيث تجميع المحتوى ، وتقديم بديل نصي يشرح <code>figure</code> . بالنسبة إلى عمليات التمثيل البصري للبيانات مثل المخططات ، يمكن استخدام التسمية التوضيحية للإحاطة علما بالاتجاهات أو الاستنتاجات للمستخدمين الذين يعانون من إعاقات بصرية. ويغطي تحد آخر كيفية نقل إصدار جدول من البيانات خارج الشاشة (باستخدام CSS) لمستخدمي قارئ الشاشة. في ما يلي مثال - لاحظ أن <code>figcaption</code> داخل علامات <code>figure</code> ويمكن دمجه مع عناصر أخرى:
```html
<figure>
<img src="roundhouseDestruction.jpeg" alt="صورة لكامبر كات ينفذ ركلة مستديرة">
<br>
<figcaption>
المعلم كامبر كات يوضح الشكل الصحيح للركلة المستديرة.
</figcaption>
</figure>
```
</section>
## Instructions
<section id="instructions"> تعمل لعبة Camper Cat بجد لإنشاء مخطط شريطي مكدّس يعرض مقدار الوقت في الأسبوع لإنفاق التدريب على التسلل والمكافحة والأسلحة. ساعده في تنظيم صفحته بشكل أفضل عن طريق تغيير علامة <code>div</code> التي استخدمها في علامة <code>figure</code> ، والعلامة <code>p</code> التي تحيط <code>figcaption</code> التوضيحية إلى علامة <code>figcaption</code> . </section>