From fce8901c564db2bbbf653c491ec4a7a6b327ab9f Mon Sep 17 00:00:00 2001
From: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>
Date: Thu, 20 Jun 2019 14:14:23 -0700
Subject: [PATCH] fix: converted single to triple backticks5 (#36232)

---
 .../index.md                                  |   5 +-
 .../index.md                                  |  14 +-
 .../index.md                                  |   9 +-
 .../index.md                                  |  33 +--
 .../index.md                                  |  33 +--
 .../index.md                                  |  45 ++--
 .../adjust-the-margin-of-an-element/index.md  |  11 +-
 .../adjust-the-padding-of-an-element/index.md |  24 +-
 .../cascading-css-variables/index.md          |  24 +-
 .../change-the-color-of-text/index.md         |  10 +-
 .../index.md                                  |  24 +-
 .../index.md                                  |   5 +-
 .../index.md                                  |  84 +++----
 .../index.md                                  |  50 ++--
 .../add-a-submit-button-to-a-form/index.md    |  10 +-
 .../comment-out-html/index.md                 |   5 +-
 .../create-a-bulleted-unordered-list/index.md |  26 ++-
 .../introduction-to-html5-elements/index.md   |  11 +-
 .../uncomment-html/index.md                   |  28 ++-
 .../index.md                                  |  31 +--
 .../index.md                                  |  13 +-
 .../index.md                                  |   7 +-
 .../index.md                                  |  25 +-
 .../index.md                                  |  11 +-
 .../index.md                                  |  13 +-
 .../use-the-flex-shorthand-property/index.md  |  13 +-
 .../index.md                                  |  10 +-
 .../add-rows-with-grid-template-rows/index.md |   5 +-
 .../index.md                                  |  10 +-
 .../index.md                                  |   5 +-
 .../create-your-first-css-grid/index.md       |  10 +-
 .../index.md                                  |   5 +-
 .../make-an-image-responsive/index.md         |  17 +-
 .../computer-science/compilers/index.md       |  23 +-
 .../data-structures/dictionaries/index.md     | 221 +++++++++---------
 .../data-structures/graphs/index.md           |  33 +--
 .../data-structures/hash-tables/index.md      |  55 +++--
 .../data-structures/linked-lists/index.md     |  67 +++---
 .../data-structures/stacks/index.md           |  38 +--
 .../document-store-databases/index.md         |  11 +-
 .../dynamic-programming/index.md              |  38 +--
 .../garbage-collection/index.md               |  17 +-
 .../arabic/computer-science/hexcode/index.md  |  24 +-
 .../notation/big-theta-notation/index.md      |  22 +-
 .../computer-science/what-is-an-api/index.md  |  35 +--
 .../docker/creating-a-new-container/index.md  |  10 +-
 guide/arabic/containers/docker/index.md       |  28 +--
 .../run-your-first-docker-image/index.md      |  28 +--
 guide/arabic/cplusplus/casting/index.md       |  93 ++++----
 .../cplusplus/clean-code-guidelines/index.md  |  78 ++++---
 .../cplusplus/conditional-operator/index.md   |  32 +--
 guide/arabic/cplusplus/erase-remove/index.md  | 128 +++++-----
 guide/arabic/cplusplus/for-loop/index.md      |  20 +-
 guide/arabic/cplusplus/functions/index.md     |  38 +--
 .../arabic/cplusplus/inline-function/index.md |  13 +-
 .../cplusplus/inline-functions/index.md       |  26 ++-
 guide/arabic/cplusplus/loops/index.md         |  43 ++--
 guide/arabic/cplusplus/map/index.md           |  11 +-
 .../object-oriented-programming/index.md      |  48 ++--
 guide/arabic/cplusplus/overloading/index.md   |  14 +-
 .../cplusplus/random-functions/index.md       |  21 +-
 .../arabic/cplusplus/range-for-loop/index.md  |  30 +--
 .../cplusplus/the-auto-feature/index.md       |  31 +--
 .../static-variable-info/index.md             |  21 +-
 guide/arabic/cplusplus/vector/index.md        | 161 +++++++------
 guide/arabic/csharp/async-await/index.md      |  74 +++---
 guide/arabic/csharp/break/index.md            |  32 +--
 guide/arabic/csharp/class/index.md            |  91 ++++----
 guide/arabic/csharp/continue/index.md         |  11 +-
 guide/arabic/csharp/do-while-loop/index.md    |  11 +-
 guide/arabic/csharp/enumerations/index.md     |  40 ++--
 guide/arabic/csharp/exceptions/index.md       |  39 ++--
 .../csharp/expression-bodied-members/index.md |  38 +--
 .../arabic/csharp/extension-methods/index.md  |   5 +-
 guide/arabic/csharp/for/index.md              |  13 +-
 75 files changed, 1299 insertions(+), 1139 deletions(-)

diff --git a/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md b/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
index b7952f2568..e6b4b92485 100644
--- a/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
+++ b/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
@@ -8,8 +8,9 @@ localeTitle: إنشاء تدرج خطي متدرج CSS
 
 الصيغة هي دائما:
 
- `background-image: linear-gradient(angle, color-stop1, color-stop2);
-`
+```
+background-image: linear-gradient(angle, color-stop1, color-stop2);
+```
 
 يمكن استخدام الألوان في تنسيقات hex () و rgb (). جرب قليلا وسوف تفهم كم هو سهل وجميل استخدامه.
 
diff --git a/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md b/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
index e94b9ef8d3..f37c531ffa 100644
--- a/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
+++ b/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
@@ -8,16 +8,16 @@ localeTitle: إنشاء خط أفقي باستخدام عنصر hr
 
 يستخدم هذا الدرس علامة `hr` لفصل عنوان ومحتوى "البطاقة". إذن كيف يمكنك إنشاء عنصر `hr` ؟
 
- `
-<!-- It's this easy --> 
- <hr> 
-` 
+```html
+<!-- It's this easy -->
+<hr>
+``` 
 
 هذا العنصر مغلق ذاتيًا ، ولكن يجب أن تضيف علامة إغلاق صريحة لكي تكون وديًا للمحللات والألعاب.
 
- `
-<hr /> 
-` 
+```html
+<hr />
+``` 
 
 أيًا كان التنسيق الذي تختاره ، سيؤدي إلى إنشاء خط أفقي كما في [هذا الدرس](https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/) على [freeCodeCamp](https://www.freecodecamp.org/) . في ما يلي لقطة شاشة من هذا الدرس تظهر عنصر `hr` مضمّن في div.
 
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
index 8ad3d2fc9a..61fc13e29f 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
@@ -12,10 +12,11 @@ localeTitle: أضف هامشًا سلبيًا إلى عنصر
 
 على سبيل المثال ، لضبط هامش عنصر ما ليكون سلبيًا ، يمكنك استخدام:
 
- `.example { 
- margin: -10px; 
- } 
-` 
+```css
+.example {
+margin: -10px;
+}
+``` 
 
 **لضبط حشو** استخدام **عنصر فردي** : الحشو: `-10` بكسل؛
 
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
index 82622877eb..b30495dd0f 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
@@ -6,24 +6,27 @@ localeTitle: إضافة هوامش مختلفة إلى كل جانب من الع
 
 لضبط هوامش استخدام عنصر:
 
- `.example { 
-  margin: 10px; 
- } 
-` 
+```css
+.example {
+  margin: 10px;
+}
+``` 
 
 لتحديد أحجام الهوامش على عنصر من جانب كل جانب ، يمكننا استخدام "الهامش الأعلى" ، "الهامش - اليمين" ، "الهامش السفلي" ، و "الهامش الأيسر". يمكننا استخدام أي من هذه في تركيبة وبأي ترتيب. فمثلا:
 
- `.example { 
-  margin-top: 5px; 
-  margin-bottom: 0px; 
- } 
-` 
+```css
+.example {
+  margin-top: 5px;
+  margin-bottom: 0px;
+}
+``` 
 
 أو:
 
- `.example { 
-  margin-top: 20px; 
-  margin-left: 25px; 
-  margin-right: 5px; 
- } 
-`
\ No newline at end of file
+```css
+.example {
+  margin-top: 20px;
+  margin-left: 25px;
+  margin-right: 5px;
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
index 7b25b154f8..ca9e6ee33e 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
@@ -6,24 +6,27 @@ localeTitle: إضافة الحشو مختلفة لكل جانب من عنصر
 
 لضبط حشو استخدام عنصر ما:
 
- `.example { 
-  padding: 10px; 
- } 
-` 
+```css
+.example {
+  padding: 10px;
+}
+``` 
 
 لتحديد أحجام الحشو على عنصر من جانب كل جانب ، يمكننا استخدام "padding-top" ، و "padding-right" ، و "padding-bottom" ، و "padding-left". يمكننا استخدام أي من هذه في تركيبة وبأي ترتيب. فمثلا:
 
- `.example { 
-  padding-top: 5px; 
-  padding-bottom: 0px; 
- } 
-` 
+```css
+.example {
+  padding-top: 5px;
+  padding-bottom: 0px;
+}
+``` 
 
 أو:
 
- `.example { 
-  padding-top: 20px; 
-  padding-left: 25px; 
-  padding-right: 5px; 
- } 
-`
\ No newline at end of file
+```css
+.example {
+  padding-top: 20px;
+  padding-left: 25px;
+  padding-right: 5px;
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
index 4650d51b31..82ef17a393 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
@@ -8,37 +8,42 @@ localeTitle: إضافة زوايا دائرية مع نصف قطر الحدود
 
 لضبط إستدارة استخدام الزاوية:
 
- `.example { 
- border-radius: 5px; 
- } 
-` 
+```css
+.example {
+border-radius: 5px;
+}
+``` 
 
 كلما زاد العدد ، كلما كانت الزاوية أكثر.
 
- `.example { 
- border-radius: 20px; 
- } 
-` 
+```css
+.example {
+border-radius: 20px;
+}
+``` 
 
 باستخدام خاصية نصف قطر الحدود ، يمكننا تقريب أركان العنصر ، سواء كان ذلك يعني تقريب حد ، أو صورة خلفية ، أو لون تعبئة العنصر نفسه. ستلاحظ فقط الزوايا المستديرة الجديدة إذا كان هناك تغيير في اللون!
 
 إذا قمت بتضمين رقم واحد فقط ، فسيتم تطبيق هذا نصف القطر على جميع الزوايا الأربع. إذا كنت تستخدم قيمتين ، ينطبق الأول على الزاويتين اليمنى العلوية والسفلية اليمنى بينما ينطبق الثاني على اليمين العلوي والسفلي الأيسر.
 
- `.exampleTwoValues { 
- border-radius: 5px 10px; 
- } 
-` 
+```css
+.exampleTwoValues {
+border-radius: 5px 10px;
+}
+``` 
 
 إذا كنت تستخدم أربع قيم ، فسيتم تطبيق القيم على أعلى اليمين ، وأعلى اليسار ، وأسفل يمين ، وأسفل اليسار.
 
- `.exampleFourValues { 
- border-radius: 5px 7px 10px 15px; 
- } 
-` 
+```css
+.exampleFourValues {
+border-radius: 5px 7px 10px 15px;
+}
+``` 
 
 إذا كنت تستخدم ثلاث قيم ، فسيتم تطبيق الأول على أعلى اليسار ، والثاني ينطبق على اليمين العلوي AND السفلي الأيسر ، والثالث ينطبق على أسفل اليمين.
 
- `.exampleThreeValues { 
- border-radius: 5px 10px 15px; 
- } 
-`
\ No newline at end of file
+```css
+.exampleThreeValues {
+border-radius: 5px 10px 15px;
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
index 872d4f178d..4c39b835c2 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
@@ -12,8 +12,9 @@ localeTitle: ضبط هامش عنصر
 
 هذا مثال على كيفية كتابته:
 
- `margin: 20px; 
-` 
+```css
+margin: 20px;
+``` 
 
 يمكنك بسهولة تغيير أو تعديل `Margin` `Element` عن طريق تغيير القيمة العددية:
 
@@ -32,6 +33,6 @@ localeTitle: ضبط هامش عنصر
   } 
 ` 
 
- `
-<h2 class="style-margin">Example</h2> 
-`
\ No newline at end of file
+```html
+<h2 class="style-margin">Example</h2>
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
index e05d0430ec..bcc261aa1c 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
@@ -12,23 +12,25 @@ localeTitle: ضبط الحشو من عنصر
 
 لضبط Padding of Alement ، استخدم:
 
- `padding: 10px; 
-` 
+```css
+padding: 10px;
+``` 
 
 لإنشاء Padding كطبقة لعنصر محدد ، استخدم:
 
- `.example-Padding { 
-  padding: 10px 
- { 
-` 
+```css
+.example-Padding {
+  padding: 10px
+{
+``` 
 
 لتطبيق هذا الصنف على الحقل المناسب ، استخدم:
 
- `
-<div class="example-Padding"> 
- <p> Example Text </p> 
- </div> 
-` 
+```html
+<div class="example-Padding">
+<p> Example Text </p>
+</div>
+``` 
 
 **لضبط Padding of Alement** ، استخدم:
 
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
index 0e9d65c7ed..548ac7c1a6 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
@@ -12,20 +12,22 @@ localeTitle: المتتالية CSS المتغيرات
 
 ### بناء الجملة
 
- `:root { 
-  --main-bkgnd-color:  #00B8CB; 
- } 
- 
- body { 
-  background-color: var(--main-bkgnd-color); 
-  font-family: 'Raleway', Helvetica, sans-serif; 
- } 
-` 
+```css
+:root {
+  --main-bkgnd-color:  #00B8CB;
+}
+
+body {
+  background-color: var(--main-bkgnd-color);
+  font-family: 'Raleway', Helvetica, sans-serif;
+}
+``` 
 
 التصريح عن المتغير:
 
- `--custom-name: value 
-` 
+```css
+--custom-name: value
+``` 
 
 باستخدام المتغير: `css var(--custom-name)`
 
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
index 0051c494ed..5d2fc86b21 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
@@ -8,10 +8,12 @@ localeTitle: تغيير لون النص
 
 ### مثال
 
- `color: red; 
-` 
+```
+color: red;
+``` 
 
 ## حل
 
- `<h2 style="color: red;">CatPhotoApp</h2> 
-`
\ No newline at end of file
+```
+<h2 style="color: red;">CatPhotoApp</h2>
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
index a171aeb031..0c4e46bb1a 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
@@ -20,11 +20,11 @@ localeTitle: إعطاء لون الخلفية لعنصر div
 
 يمكنك بعد ذلك إضافة `class` إلى `div` :
 
- `
-<div class="blue-background"> 
-  <p> Example </p> 
- </div> 
-` 
+```html
+<div class="blue-background">
+  <p> Example </p>
+</div>
+``` 
 
 **الطريقة الثانية:**
 
@@ -34,10 +34,10 @@ localeTitle: إعطاء لون الخلفية لعنصر div
 
 (وهذا يعني أنها `class` متكررة لكل عنصر `div` تقوم بإنشائه.)
 
- `
-<style> 
-  div { 
-    background-color: blue; 
-  } 
- </style> 
-`
\ No newline at end of file
+```html
+<style>
+  div {
+    background-color: blue;
+  }
+</style>
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
index f826ba7771..3600843cdc 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
@@ -15,8 +15,9 @@ localeTitle: تجاوز كافة الأنماط الأخرى باستخدام ه
 3.  إعلانات معرف
 4.  تصريحات الطبقة
 
- `Here is an example of how to write/apply !important: 
-` 
+```
+Here is an example of how to write/apply !important:
+``` 
 
 المغلق اللون: أسود!
 
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
index 748ac96d8b..8169d8e5fd 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
@@ -10,22 +10,22 @@ localeTitle: تجاوز تعريفات الطبقة عن طريق تحديد س
 
 مثال على ذلك هو:
 
- `
-<style> 
-  body { 
-    background-color: black; 
-    font-family: Arial; 
-    color: black; 
-  } 
-  .red-text { 
-    color: red; 
-  } 
-  .blue-text { 
-    color: blue; 
-  } 
- </style> 
- <h1 class="red-text blue-text">Example</h1> 
-` 
+```html
+<style>
+  body {
+    background-color: black;
+    font-family: Arial;
+    color: black;
+  }
+  .red-text {
+    color: red;
+  }
+  .blue-text {
+    color: blue;
+  }
+</style>
+<h1 class="red-text blue-text">Example</h1>
+``` 
 
 في المثال أعلاه ، سيكون نص `Example` باللون الأزرق لأن آخر صف تمت إضافته كان `blue-text` .
 
@@ -33,34 +33,34 @@ localeTitle: تجاوز تعريفات الطبقة عن طريق تحديد س
 
 يمكنك إنشاء سمة `id` عن طريق إضافة الرمز `#` قبل اسم الفئة ، كما هو موضح أدناه:
 
- `
-<style> 
-  #purple-text { 
-    color: purple; 
-  } 
- </style> 
-` 
+```html
+<style>
+  #purple-text {
+    color: purple;
+  }
+</style>
+``` 
 
 هذا مثال يوضح لك كيفية **تجاوز تعريفات Class بواسطة سمات معرف التصميم** :
 
- `
-<style> 
-  body { 
-    background-color: black; 
-    font-family: Arial; 
-    color: black; 
-  } 
-  .red-text { 
-    color: red; 
-  } 
-  .blue-text { 
-    color: blue; 
-  } 
-  #green-color { 
-    color: green; 
-  } 
- </style> 
- <h1 id="green-color" class="red-text blue-text">Example</h1> 
-` 
+```html
+<style>
+  body {
+    background-color: black;
+    font-family: Arial;
+    color: black;
+  }
+  .red-text {
+    color: red;
+  }
+  .blue-text {
+    color: blue;
+  }
+  #green-color {
+    color: green;
+  }
+</style>
+<h1 id="green-color" class="red-text blue-text">Example</h1>
+``` 
 
 سيؤدي ذلك إلى جعل النص `Example` أخضر لأن سمة `id` ستحظى دائمًا بالأسبقية على تعريفات `class` .
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md b/guide/arabic/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
index 767505cf73..eb908feb15 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
@@ -10,19 +10,19 @@ localeTitle: تجاوز الأنماط في CSS لاحقة
 
 فمثلا:
 
- `
-<style> 
-  body { 
-    color: purple; 
-  } 
-  .red-text { 
-    color: red; 
-  } 
-  .blue-text { 
-    color: blue; 
-  { 
- </style> 
-` 
+```html
+<style>
+  body {
+    color: purple;
+  }
+  .red-text {
+    color: red;
+  }
+  .blue-text {
+    color: blue;
+  {
+</style>
+``` 
 
 الآن، عند إنشاء أي نص في `body` ، وسوف يكون لون النص `purple` المسندة إليها.
 
@@ -30,21 +30,21 @@ localeTitle: تجاوز الأنماط في CSS لاحقة
 
 باستخدام التنسيق أعلاه ، سيتجاوز النص أدناه لون الخط `purple` السابق `purple` `red` .
 
- `
-<h1 class="red-text">Example</h1> 
-` 
+```html
+<h1 class="red-text">Example</h1>
+``` 
 
 عندما تريد إضافة عدة فئات ، يمكنك استخدام هذا التنسيق:
 
- `
-<h1 class="class-name1 class-name2 class-name3">Example</h1> 
-` 
+```html
+<h1 class="class-name1 class-name2 class-name3">Example</h1>
+``` 
 
 يمكنك الآن إضافة الفئة الأخيرة التي تم إنشاؤها أعلاه ( `"blue-text"` ) إلى نفس المثال أعلاه لمشاهدة النتائج.
 
- `
-<h1 class="red-text blue-text">Example</h1> 
-` 
+```html
+<h1 class="red-text blue-text">Example</h1>
+``` 
 
 سيؤدي ذلك تلقائيًا إلى اختيار الفصل الأخير الذي تم إنشاؤه في قسم الأنماط ، والذي كان في هذه الحالة هو `"blue-text"` .
 
@@ -52,9 +52,9 @@ localeTitle: تجاوز الأنماط في CSS لاحقة
 
 لذلك ، على سبيل المثال:
 
- `
-<h1 class="blue-text red-text">Example</h1> 
-` 
+```html
+<h1 class="blue-text red-text">Example</h1>
+``` 
 
 سيظل هذا يعرض لون خط `blue` بسبب الترتيب في قسم الأنماط.
 
diff --git a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
index 13caea23dd..0dd7a1d9c1 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
@@ -9,12 +9,14 @@ localeTitle: إضافة زر إرسال إلى نموذج
 
 1) تكون قيمة `submit` `type` السمة صالحة أيضًا داخل علامة `input` وستعرض زرًا له نفس السلوك تقريبًا ، ولكن هذه ليست العلامة التي تريد استخدامها في هذا التحدي.
 
- `<input type="submit">
-`
+```
+<input type="submit">
+```
 
 إذا لم تحدد قيمة ، فسيحتوي الزر على قيمة افتراضية تم اختيارها من قِبل وكيل المستخدم (عادةً ما يكون هذا بمثابة "إرسال" أو "إرسال الاستعلام").
 
 إذا كنت ترغب في تحديد قيمة مثل "إرسال طلب" ، فيمكنك إجراء ذلك على النحو التالي:
 
- `<input type="submit" value="Send Request">
-`
\ No newline at end of file
+```
+<input type="submit" value="Send Request">
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
index a5004b2c63..ed7e731e50 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
@@ -8,8 +8,9 @@ localeTitle: تعليق من HTML
 
 مثال:
 
- `<!-- code --> 
-` 
+```
+<!-- code -->
+``` 
 
 subElement | وصف ---------- | ----------- `<!--` | علامة الفتح كود | نص علق `-->` | علامة الإغلاق
 
diff --git a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
index 9661355ebd..b59da1bf43 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
@@ -10,20 +10,22 @@ localeTitle: قم بإنشاء قائمة غير مرتبة بالعدادات
 
 صيح:
 
- `<ul> 
-  <li></li> 
-  <li></li> 
- </ul> 
-` 
+```
+<ul>
+  <li></li>
+  <li></li>
+</ul>
+``` 
 
 غير صحيح:
 
- `<ul> 
-  <li> 
-    <li> 
-    </li> 
-  </li> 
- </ul> 
-` 
+```
+<ul>
+  <li>
+    <li>
+    </li>
+  </li>
+</ul>
+``` 
 
 حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
index dc7f557531..3dc7f9cff5 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
@@ -8,10 +8,11 @@ localeTitle: مقدمة إلى عناصر HTML5
 
 المثال أدناه يمثل عنصر `h1` وعنصر `h4` ملفوفًا في عنصر `header` :
 
- `<header> 
-  <h1> Big title </h1> 
-  <h4> Tiny subtitle </h4> 
- </header> 
-` 
+```
+<header>
+  <h1> Big title </h1>
+  <h4> Tiny subtitle </h4>
+</header>
+``` 
 
 كما ترى ، يحتوي `header` على العناصر الأخرى التي تنتهي في نفس المستوى (ينتهي `h1` قبل بدء `h4` ويكون كلاهما متداخلين في `header` ).
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
index 19f24219b5..b0e90f65a2 100644
--- a/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
+++ b/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
@@ -6,12 +6,13 @@ localeTitle: Uncomment HTML
 
 موضوع التعليق غالبًا ما يكون مربكًا بعض الشيء في البداية. انظر الى المثال:
 
- `<!-- This is a commented block. 
- It doesn't matter how long it is, if it has <h1>HTML elements</h1> in it or if it develops 
- into 
- few lines, 
- everything between the first weird series of character and the last is commented out --> 
-` 
+```
+<!-- This is a commented block.
+It doesn't matter how long it is, if it has <h1>HTML elements</h1> in it or if it develops
+into
+few lines,
+everything between the first weird series of character and the last is commented out -->
+``` 
 
 يمكنك استخدام التعليق في الخط أيضا: `<!-- Uh, I does not exists! -->` وهنا!
 
@@ -21,19 +22,22 @@ localeTitle: Uncomment HTML
 
 Uncomment تعني إخراج الأشياء من نص التعليق: لإزالة unicment عنصر h3 في الجملة التالية (التي تم التعليق عليها كلها):
 
- `<!-- <h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> --> 
-` 
+```
+<!-- <h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> -->
+``` 
 
 سهل مثل:
 
- `<!-- <h1>Comment header</h1> --> <h3>Comment subtle</h3> <!-- <article>I am the text of the comment</article> --> 
-` 
+```
+<!-- <h1>Comment header</h1> --> <h3>Comment subtle</h3> <!-- <article>I am the text of the comment</article> -->
+``` 
 
 لاحظ كيف تمت إضافة علامة تعليق إغلاق ( `-->` ) قبل عنصر HTML h3 لمطابقة علامة التعليق الافتتاحية في بداية الجملة وإضافة علامة تعليق افتتاحية ( `<!--` ) بعدها لتتطابق مع الإغلاق علامة في النهاية: بهذه الطريقة ، تكون قد أنشأت تعليقين مضمّنين ​​، أحدهما قبل عنصر h3 والآخر بعد !.
 
 إذا كنت تريد إلغاء ربط كل شيء ، سيكون الأمر أسهل:
 
- `<h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> 
-` 
+```
+<h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article>
+``` 
 
 ما عليك سوى إزالة علامة الفتح والإغلاق للتعليق.
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md b/guide/arabic/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
index d93cd07ab1..1daf9ec152 100644
--- a/guide/arabic/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
@@ -8,25 +8,28 @@ localeTitle: أضف Flex Flexpowers إلى Tweet تضمين
 
 سيضمن الرأس أن الصورة والاسم والمقبض ومتابعة الأزرار ستتم إعادة ترتيبها بشكل أفقي.
 
- `header { 
-    display: flex; 
- } 
-` 
+```CSS
+header {
+    display: flex;
+}
+``` 
 
 يحاذي الاسم والمقبض ليبدو كجملة واحدة.
 
- `header .profile-name { 
-    display:flex; 
-    margin-left: 10px; 
-  } 
-` 
+```CSS
+header .profile-name {
+    display:flex;
+    margin-left: 10px;
+  }
+``` 
 
 ستؤدي إضافة الخاصية إلى زر المتابعة مع الهامش إلى توسيط الزر إلى الحجم الصحيح.
 
- `header .follow-btn { 
-    display:flex; 
-    margin: 0 0 0 auto; 
-  } 
-` 
+```CSS
+header .follow-btn {
+    display:flex;
+    margin: 0 0 0 auto;
+  }
+``` 
 
 يتم استخدام نفس الفكرة على عناصر التذييل.
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md b/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
index f4e25e2ae4..25ce929437 100644
--- a/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
@@ -6,9 +6,10 @@ localeTitle: قم بتطبيق الخاصية ذات الاتجاه المرن 
 
 سيؤدي تغيير اتجاه المرن من صفه الافتراضي إلى العمود عن طريق إضافة الخاصية إلى css بشكل واضح إلى إظهار المقبض لإخفاء الاسم.
 
- `header .profile-name { 
-    display: flex; 
-    flex-direction: column; 
-    margin-left: 10px; 
-  } 
-`
\ No newline at end of file
+```css
+header .profile-name {
+    display: flex;
+    flex-direction: column;
+    margin-left: 10px;
+  }
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
index bfa057834c..b0e2b854d9 100644
--- a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
@@ -10,7 +10,8 @@ localeTitle: استخدم العرض
 
 مثال:
 
- `#main-container {
+```CSS
+#main-container {
     display: flex;
- }
-`
\ No newline at end of file
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
index fcdf9fb992..42c8fdce02 100644
--- a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
@@ -6,15 +6,16 @@ localeTitle: استخدم الخاصية الأساسية المرنة لتعي
 
 يمكنك تحقيق نفس تأثير التحديتين السابقتين مع `flax-basis` . بعد تحديد قيم approati ، سترى `#box-2` أكبر من `#box-1` قبل تطبيق أي تقلص أو نمو.
 
- `#box-1 { 
-  background-color: dodgerblue; 
-  height: 200px; 
-  flex-basis: 10em; 
- } 
- 
- #box-2 { 
-  background-color: orangered; 
-  height: 200px; 
-  flex-basis: 20em; 
- } 
-`
\ No newline at end of file
+```css
+#box-1 {
+  background-color: dodgerblue;
+  height: 200px;
+  flex-basis: 10em;
+}
+
+#box-2 {
+  background-color: orangered;
+  height: 200px;
+  flex-basis: 20em;
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
index 48756d09f2..74cbfd73cb 100644
--- a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
@@ -6,8 +6,9 @@ localeTitle: استخدم خاصية الاتجاه المرن لعمل عمود
 
 لتكديس العناصر الفرعية للحاوية المرنة فوق بعضها البعض ، يمكنك تغيير _الاتجاه المرن_ بالطريقة التالية:
 
- `#main-container { 
-    display: flex; 
-    flex-direction: column; 
- } 
-`
\ No newline at end of file
+```CSS
+#main-container {
+    display: flex;
+    flex-direction: column;
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
index 73aa245a72..891e2dadda 100644
--- a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
@@ -6,11 +6,12 @@ localeTitle: استخدم خاصية الاتجاه المرن لإجراء صف
 
 بمجرد أن يكون لديك حاوية مرنة عن طريق إضافة _الشاشة: flex؛_ إلى الحاوية الرئيسية ، يمكنك تحديد ما إذا كنت تريد تكديس الأطفال في صف عن طريق إضافة ما يلي:
 
- `#box-container { 
-    display: flex; /* This makes the flex container */ 
-    height: 500px; 
-    flex-direction: row-reverse; /* This makes the direction be a row with reversed elements */ 
-  } 
-` 
+```css
+#box-container {
+    display: flex; /* This makes the flex container */
+    height: 500px;
+    flex-direction: row-reverse; /* This makes the direction be a row with reversed elements */
+  }
+``` 
 
 ستلاحظ كيف أن ألوان تبديل المواضع مثل الاتجاه الافتراضي للحاويات المرنة هي صفوف كما قد تكون لاحظت من [مثال tweet](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md) .
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
index f097a5516d..ca4e16338f 100644
--- a/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
@@ -8,9 +8,10 @@ localeTitle: استخدم خاصية الاختزال المرن
 
 مثال:
 
- `#box-1 { 
-    background-color: dodgerblue; 
-    flex: 2 2 150px; 
-    height: 200px; 
-  } 
-`
\ No newline at end of file
+```css
+#box-1 {
+    background-color: dodgerblue;
+    flex: 2 2 150px;
+    height: 200px;
+  }
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md b/guide/arabic/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
index 2643a6b812..e4c00078ef 100644
--- a/guide/arabic/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
@@ -10,8 +10,9 @@ localeTitle: إضافة أعمدة بأعمدة قالب الشبكة
 
 يمكنك تعريف الأعمدة عن طريق التصريح بما يلي في codeblock الخاص بـ CSS:
 
- `grid-template-columns: parameters; 
-` 
+```css
+grid-template-columns: parameters;
+``` 
 
 حيث المعلمات هي كل ما تريد أن تكون.
 
@@ -19,5 +20,6 @@ localeTitle: إضافة أعمدة بأعمدة قالب الشبكة
 
 نظرًا لأن التحدي يتطلب منك إنشاء ثلاثة أعمدة يبلغ حجم كل منها 100 بكسل ، فأخبر المتابعين في ملف تعريف الارتباط .container CSS:
 
- `grid-template-columns: 100px 100px 100px; 
-`
\ No newline at end of file
+```css
+grid-template-columns: 100px 100px 100px;
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md b/guide/arabic/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
index 081134541b..95759b20fe 100644
--- a/guide/arabic/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
@@ -14,5 +14,6 @@ localeTitle: إضافة صفوف مع صفوف قالب الشبكة
 
 نظرًا لأن التحدي يتطلب منك إنشاء صفين من `50px` لكل منهما ، `.container` بتعريف المتابعة في كتلة التعليمة البرمجية الخاصة بـ `.container` CSS:
 
- `grid-template-rows: 50px 50px; 
-`
\ No newline at end of file
+```css
+grid-template-rows: 50px 50px;
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md b/guide/arabic/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
index 514433b017..0c6259d9d1 100644
--- a/guide/arabic/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
@@ -10,8 +10,9 @@ localeTitle: إنشاء فجوة عمود باستخدام الفجوة بين 
 
 لإضافة الفجوة بين أعمدة الشبكة ، نستخدم:
 
- `grid-column-gap: parameter; 
-` 
+```css
+grid-column-gap: parameter;
+``` 
 
 حيث المعلمة هي الفجوة المطلوبة.
 
@@ -19,5 +20,6 @@ localeTitle: إنشاء فجوة عمود باستخدام الفجوة بين 
 
 نظرًا لأن التحدي قد أدى إلى إضافة فجوة بمقدار 20 بكسل ، يمكنك إضافة السطر التالي إلى crameblock CSS.
 
- `grid-column-gap: 20px; 
-`
\ No newline at end of file
+```css
+grid-column-gap: 20px;
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md b/guide/arabic/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
index 3ec71c5852..a6fc997677 100644
--- a/guide/arabic/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
@@ -14,5 +14,6 @@ localeTitle: إنشاء فجوة صف باستخدام الفجوة بين ال
 
 نظرًا لأن التحدي يتمثل في إضافة فجوة قدرها 5 `5px` ، يمكنك إضافة السطر التالي إلى كتلة شفرة `.container` CSS.
 
- `grid-row-gap: 5px; 
-`
\ No newline at end of file
+```css
+grid-row-gap: 5px;
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md b/guide/arabic/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
index 558dc890a6..af94b78cc1 100644
--- a/guide/arabic/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
@@ -8,8 +8,9 @@ localeTitle: إنشاء أول شبكة CSS
 
 لتغيير عرض أي عنصر ، يتم استخدام البنية التالية:
 
- `display: propertyName; 
-` 
+```css
+display: propertyName;
+``` 
 
 ### تلميح 2
 
@@ -23,5 +24,6 @@ localeTitle: إنشاء أول شبكة CSS
 
 لتعيين عرض عنصر .container على الشبكة:
 
- `display: grid; 
-`
\ No newline at end of file
+```css
+display: grid;
+```
\ No newline at end of file
diff --git a/guide/arabic/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md b/guide/arabic/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
index 7e8947cf7f..286a9ce2fb 100644
--- a/guide/arabic/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
+++ b/guide/arabic/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
@@ -14,8 +14,9 @@ localeTitle: استخدم CSS الشبكة وحدات لتغيير حجم الأ
 
 نظرًا لأن التحدي يتطلب منك تعيين العرض على `1fr` و `100px` و `2fr` ، `2fr` بتغيير خاصية `css grid-template-columns` الخاصة بـ `.container` إلى:
 
- `grid-template-columns: 1fr 100px 2fr; 
-` 
+```css
+grid-template-columns: 1fr 100px 2fr;
+``` 
 
 #### المزيد من المعلومات
 
diff --git a/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md b/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
index 635dfd28b9..1c8649e6f5 100644
--- a/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
+++ b/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
@@ -10,11 +10,12 @@ localeTitle: جعل صورة مستجيبة
 
 يصبح النمط:
 
- `<style> 
-  img { 
-  max-width: 100%; 
-  display: block; 
-  height: auto; 
- } 
- </style> 
-`
\ No newline at end of file
+```css
+<style>
+  img {
+  max-width: 100%;
+  display: block;
+  height: auto;
+}
+</style>
+```
\ No newline at end of file
diff --git a/guide/arabic/computer-science/compilers/index.md b/guide/arabic/computer-science/compilers/index.md
index 65404f0451..ac77043b7f 100644
--- a/guide/arabic/computer-science/compilers/index.md
+++ b/guide/arabic/computer-science/compilers/index.md
@@ -12,10 +12,11 @@ localeTitle: المجمعين
 
 فمثلا،
 
- `ADD 10, 20  // ADD is the Opcode 
-            // and 10, 20 are the two operands(data) 
-            // needed for the ADD instruction to be executed successfully 
-` 
+```
+ADD 10, 20  // ADD is the Opcode
+            // and 10, 20 are the two operands(data)
+            // needed for the ADD instruction to be executed successfully
+``` 
 
 يطور البشر برامج لحل المشكلات المعقدة. بالنظر إلى كيفية عمل رموز التشغيل البسيطة ، إذا حاولنا تطوير برامج باستخدام opcodes وحده ، فسيكون ذلك مرهقًا للغاية ويصعب تصحيحه. لحل هذه المشكلة ، تم تطوير لغات عالية المستوى مثل C / C ++ و Python و Java و Javascript وغيرها.
 
@@ -41,15 +42,17 @@ localeTitle: المجمعين
 
 يأخذ _Lexical Analysis_ الشفرة الأولية وينقسمها إلى هذه الأشياء التي يطلق عليها الرموز المميزة بشيء يسمى tokenizer (أو lexer).
 
- `Tokens are an array of tiny little objects that describe an isolated piece of the syntax. 
- They could be numbers, labels, punctuation, operators, etc. 
-` 
+```
+Tokens are an array of tiny little objects that describe an isolated piece of the syntax.
+They could be numbers, labels, punctuation, operators, etc.
+``` 
 
 يأخذ _التحليل النحوي_ الرموز المميزة ويعيد تنسيقها إلى تمثيل يصف كل جزء من البنية وعلاقتهم مع بعضهم البعض. يُعرف هذا بالتمثيل الوسيط أو شجرة الجملة المجردة.
 
- `An Abstract Syntax Tree, or AST for short, is a deeply nested object. 
- It represents code in a way that is both easy to work with and tells us a lot of information. 
-` 
+```
+An Abstract Syntax Tree, or AST for short, is a deeply nested object.
+It represents code in a way that is both easy to work with and tells us a lot of information.
+``` 
 
 #### تحويل
 
diff --git a/guide/arabic/computer-science/data-structures/dictionaries/index.md b/guide/arabic/computer-science/data-structures/dictionaries/index.md
index fd89cec060..f096b8be97 100644
--- a/guide/arabic/computer-science/data-structures/dictionaries/index.md
+++ b/guide/arabic/computer-science/data-structures/dictionaries/index.md
@@ -8,33 +8,35 @@ localeTitle: قواميس
 
 إليك القائمة التي سنعمل معها:
 
- `ice_cream = ["strawberry", 
-             "vanilla", 
-             "vanilla", 
-             "chocolate", 
-             "chocolate", 
-             "chocolate", 
-             "banana", 
-             "rum raisin", 
-             "banana"] 
-` 
+```python
+ice_cream = ["strawberry",
+             "vanilla",
+             "vanilla",
+             "chocolate",
+             "chocolate",
+             "chocolate",
+             "banana",
+             "rum raisin",
+             "banana"]
+``` 
 
 يعطي هذا الرمز ، الذي يستخدم متداخلاً لحلقات ، الإجابة الصحيحة ، وتخزين الإجابة في قائمة "العد":
 
- `count = [] 
- for flavor in ice_cream: 
-  found = False 
-  for entry in count: 
-    if entry[0] == flavor: 
-      entry[1] += 1 
-      found = True 
-  if not found: 
-      count.append([flavor, 1]) 
- 
- # Print. 
- for (entry, total) in count: 
-  print (entry, total) 
-` 
+```python
+count = []
+for flavor in ice_cream:
+  found = False
+  for entry in count:
+    if entry[0] == flavor:
+      entry[1] += 1
+      found = True
+  if not found:
+      count.append([flavor, 1])
+
+# Print.
+for (entry, total) in count:
+  print (entry, total)
+``` 
 
 على الرغم من أن هذا الرمز يعطي الإجابة الصحيحة ، إلا أنه يوجد شيئان خاطئان به. أولاً ، إنها معقدة. كلما زاد عدد الحلقات المتداخلة التي يحتوي عليها البرنامج ، كلما كان من الصعب فهمها وإصلاحها وتوسيعها. علاوة على ذلك ، فهو غير فعال. قد لا يكون هذا مشكلة في هذا المثال الصغير ، ولكن تخيل قائمة تحتوي على آلاف أو ملايين العناصر. إن مسح قائمة الإدخالات في كل مرة نقوم فيها بملاحظة تستغرق وقتًا طويلاً للغاية ، بغض النظر عن سرعة الكمبيوتر. هذا موضوع تم تناوله بشكل كامل عند دراسة موضوعات مثل التدوين الكبير O ومقارنة خوارزميات البحث والفرز.
 
@@ -44,65 +46,70 @@ localeTitle: قواميس
 
 فيما يلي بعض أمثلة التعليمات البرمجية:
 
- `ice_cream = {'chocolate' : 3, 'strawberry' : 1} 
- print (ice_cream) 
- >> {'chocolate' : 3, 'strawberry' : 1} 
- print (ice_cream['strawberry']) 
- >> 1 
-` 
+```python
+ice_cream = {'chocolate' : 3, 'strawberry' : 1}
+print (ice_cream)
+>> {'chocolate' : 3, 'strawberry' : 1}
+print (ice_cream['strawberry'])
+>> 1
+``` 
 
 لاختبار ما إذا كان المفتاح موجودًا في أحد القواميس ، استخدم k في d:
 
- `ice_cream = {'chocolate' : 3, 'strawberry' : 1} 
- if 'chocolate' in ice_cream: 
-    print ('chocolate is in the list') 
- ... 
- 
- del ice_cream['chocolate'] 
- if 'chocolate' in ice_cream: 
-    print ('oops: why is chocolate still there?') 
-` 
+```python
+ice_cream = {'chocolate' : 3, 'strawberry' : 1}
+if 'chocolate' in ice_cream:
+    print ('chocolate is in the list')
+...
+
+del ice_cream['chocolate']
+if 'chocolate' in ice_cream:
+    print ('oops: why is chocolate still there?')
+``` 
 
 **تحديث والعضوية** لتحديث القواميس ، ما عليك سوى تعيين قيمة للمفتاح. إذا كان المفتاح موجودًا بالفعل في القاموس ، فسيؤدي ذلك إلى تغيير القيمة المرتبطة به.
 
 إذا لم يكن المفتاح موجودًا ، فيتم إضافته بالإضافة إلى القيمة:
 
- `ice_cream = {} 
- ice_cream['chocolate'] = 33 
- ice_cream['vanilla'] = 999 # oops 
- print (ice_cream) 
- >> {'chocolate' : 33, vanilla' : 999} 
- ice_cream['vanilla'] = 9 
- print (ice_cream) 
- >> {'chocolate' : 33, vanilla' : 9} 
-` 
+```python
+ice_cream = {}
+ice_cream['chocolate'] = 33
+ice_cream['vanilla'] = 999 # oops
+print (ice_cream)
+>> {'chocolate' : 33, vanilla' : 999}
+ice_cream['vanilla'] = 9
+print (ice_cream)
+>> {'chocolate' : 33, vanilla' : 9}
+``` 
 
 استخدم _del d \[k\]_ ، لإزالة إدخال من قاموس ، حيث _d_ هو اسم القاموس و _k_ هو المفتاح الذي يتم إزالته. يمكن إزالة الإدخالات الموجودة فقط؛ محاولة إزالة واحدة غير موجودة يسبب خطأ:
 
- `ice_cream = {'chocolate' : 33, vanilla' : 9} 
- del ice_cream['chocolate'] 
- print (ice_cream) 
- >> {'vanilla' : 9} 
- del ice_cream['strawberry'] 
- >> Traceback (most recent call last): 
-   File "<stdin>", line 5, in <module> 
-   KeyError: 'strawberry' 
-` 
+```python
+ice_cream = {'chocolate' : 33, vanilla' : 9}
+del ice_cream['chocolate']
+print (ice_cream)
+>> {'vanilla' : 9}
+del ice_cream['strawberry']
+>> Traceback (most recent call last):
+   File "<stdin>", line 5, in <module>
+   KeyError: 'strawberry'
+``` 
 
 **الحلقات** بما أن القواميس عبارة عن مجموعات (جنباً إلى جنب مع القوائم ، والصفوف ، والمجموعات) ، فإننا سنرغب في تكرار حلقاتها محتويات. نقوم بذلك من خلال حلقة for ، والتي تقوم بتعيين كل من المفاتيح في القاموس إلى متغير الحلقة بدوره:
 
- `ice_cream = {'chocolate' : 183, 
-             'vanilla' : 71, 
-             'strawberry' : 63, 
-             'banana', 1} 
- for flavor in ice_cream: 
-  print (flavor, ice_cream[flavor]) 
- 
- >> 'banana' 1 
-   'vanilla' 71 
-   'chocolate' 183 
-   'strawberry' 63 
-` 
+```python
+ice_cream = {'chocolate' : 183,
+             'vanilla' : 71,
+             'strawberry' : 63,
+             'banana', 1}
+for flavor in ice_cream:
+  print (flavor, ice_cream[flavor])
+
+>> 'banana' 1
+   'vanilla' 71
+   'chocolate' 183
+   'strawberry' 63
+``` 
 
 كما هو الحال مع العناصر المحددة ، تقوم بايثون بتكرار أكثر من الإدخالات في القاموس بترتيب عشوائي. ليس هناك ما يضمن أن ينظر إليها أبجديا أو بالترتيب ، تم إضافتها إلى القاموس. لاحظ ، بالمناسبة ، أن التكرار فوق القواميس يختلف قليلاً عن التكرار على القوائم. عندما تقوم بايثون بتكرار أكثر من قائمة ، يتم تعيين القيم في القائمة للمتغير المتكرر. عندما تقوم الحلقات عبر قاموس ، من ناحية أخرى ، فإنه يعيّن المفاتيح. اختار مصممو بيثون القيام بذلك بسبب:
 
@@ -124,48 +131,50 @@ localeTitle: قواميس
 
 لنعد إلى المثال الأصلي - كيف نحسب عدد العناصر في قائمة ice\_cream باستخدام القاموس؟
 
- `# Count all the flavors. 
- ice_cream = ["strawberry", 
-             "vanilla", 
-             "vanilla", 
-             "chocolate", 
-             "chocolate", 
-             "chocolate", 
-             "banana", 
-             "rum raisin", 
-             "banana"] 
- 
- count = {} 
- for flavor in ice_cream: 
-  if flavor in count: 
-    count[flavor] = count[flavor] + 1 
-  else: 
-    count[flavor] = 1 
- 
- # Print. 
- for b in count: 
-  print (b, count[b]) 
-` 
+```python
+# Count all the flavors.
+ice_cream = ["strawberry",
+             "vanilla",
+             "vanilla",
+             "chocolate",
+             "chocolate",
+             "chocolate",
+             "banana",
+             "rum raisin",
+             "banana"]
+
+count = {}
+for flavor in ice_cream:
+  if flavor in count:
+    count[flavor] = count[flavor] + 1
+  else:
+    count[flavor] = 1
+
+# Print.
+for b in count:
+  print (b, count[b])
+``` 
 
 للقيام بذلك ، نقوم بإنشاء قاموس فارغ في البداية. في كل مرة يتم فيها التكرار عبر قائمة ice\_cream ، نتحقق من ذلك لمعرفة ما إذا كانت النكهة موجودة بالفعل في قاموس العدد. إذا كان كذلك ، نضيف واحدة إلى حسابها. إذا لم يكن الأمر كذلك ، فسنضيف الاسم إلى القاموس ذي القيمة 1.
 
 يمكننا اختصار هذا البرنامج قليلا باستخدام الطريقة _dict.get ()_ . هذا يعيد إما القيمة المرتبطة بمفتاح أو بعض القيمة الافتراضية التي نقدمها. في هذه الحالة ، نحصل إما على عدد المرات التي رأينا فيها بالفعل نكهة أو صفر ، أضف واحدًا إلى أي قيمة ترجعها الطريقة ، وتخزينها مرة أخرى في القاموس:
 
- `# Count all the flavors. 
- count = {} 
- for flavor in ice_cream: 
-  count[flavor] = count.get(flavor, 0) + 1 
- 
- # Print. 
- keys = count.keys() 
- keys.sort() 
- for b in keys: 
-  print (b, count[b]) 
- 
- # Print. 
- for key in sorted(count): 
-  print (key, count[key]) 
-` 
+```python
+# Count all the flavors.
+count = {}
+for flavor in ice_cream:
+  count[flavor] = count.get(flavor, 0) + 1
+
+# Print.
+keys = count.keys()
+keys.sort()
+for b in keys:
+  print (b, count[b])
+
+# Print.
+for key in sorted(count):
+  print (key, count[key])
+``` 
 
 لاحظ أننا نستخدم طريقتين منفصلتين لطباعة المفتاح والقيمة: يستخدم أحدهما طريقة التصنيف في Python ، والآخر لا يفعل ذلك.
 
diff --git a/guide/arabic/computer-science/data-structures/graphs/index.md b/guide/arabic/computer-science/data-structures/graphs/index.md
index 17ed9c36fe..24217a75c0 100644
--- a/guide/arabic/computer-science/data-structures/graphs/index.md
+++ b/guide/arabic/computer-science/data-structures/graphs/index.md
@@ -23,22 +23,23 @@ localeTitle: الرسوم البيانية
 
 مثال: رسم بياني يحتوي على عُقد في بلدان الشمال الأوروبي ، وباعتباره (غير موجه) يحرك مسافة القيادة إلى المدن المتصلة بالطريق المباشر.
 
- `.     +---------+ 
- .     |Reykjavik| 
- .     +---------+ 
- . 
- . 
- .         529 km   +---------+  1760 km  +--------+ 
- .    +------------+|Stockholm|+---------+|Helsinki| 
- .    |             +---------+           +--------+ 
- .    +                                        + 
- . +----+                    1991 km           | 
- . |Oslo|+-------------------------------------+ 
- . +----+ 
- .         +----------+ 
- .         |Copenhagen| 
- .         +----------+ 
-` 
+```
+.     +---------+
+.     |Reykjavik|
+.     +---------+
+.
+.
+.         529 km   +---------+  1760 km  +--------+
+.    +------------+|Stockholm|+---------+|Helsinki|
+.    |             +---------+           +--------+
+.    +                                        +
+. +----+                    1991 km           |
+. |Oslo|+-------------------------------------+
+. +----+
+.         +----------+
+.         |Copenhagen|
+.         +----------+
+``` 
 
 #### معلومات اكثر:
 
diff --git a/guide/arabic/computer-science/data-structures/hash-tables/index.md b/guide/arabic/computer-science/data-structures/hash-tables/index.md
index 5e8b3ae1f4..480ecbb431 100644
--- a/guide/arabic/computer-science/data-structures/hash-tables/index.md
+++ b/guide/arabic/computer-science/data-structures/hash-tables/index.md
@@ -18,21 +18,24 @@ localeTitle: جداول تجزئة
 
 تتمثل فكرة التجزئة في توزيع المدخلات (أزواج المفاتيح / القيم) عبر مجموعة من المجموعات. عند الحصول على مفتاح ، تقوم الخوارزمية بحساب فهرس يشير إلى المكان الذي يمكن العثور فيه على الإدخال:
 
- `index = f(key, array_size) 
-` 
+```
+index = f(key, array_size)
+``` 
 
 يتم ذلك غالبًا في خطوتين:
 
- `hash = hashfunc(key) 
- index = hash % array_size 
-` 
+```
+hash = hashfunc(key)
+index = hash % array_size
+``` 
 
 في هذه الطريقة ، يكون التجزئة مستقلاً عن حجم الصفيف ، ثم يتم تخفيضه إلى فهرس (رقم بين 0 و array\_size - 1) باستخدام مشغل modulo (٪).
 
 دعنا نفكر في السلسلة S. أنت مطالب بحساب معدل تكرار جميع الأحرف في هذه السلسلة.
 
- `string S = “ababcd” 
-` 
+```
+string S = “ababcd”
+``` 
 
 إن أبسط طريقة للقيام بذلك هي التكرار على جميع الأحرف الممكنة وحساب ترددها واحدة تلو الأخرى. وقت تعقيد هذا الأسلوب هو O (26 \* N) حيث N هو حجم السلسلة ويوجد 26 حرفًا محتملًا.
 
@@ -51,15 +54,16 @@ localeTitle: جداول تجزئة
 
 انتاج |
 
- `a 2 
- b 2 
- c 1 
- d 1 
- e 0 
- f 0 
- … 
- z 0 
-` 
+```
+a 2
+b 2
+c 1
+d 1
+e 0
+f 0
+…
+z 0
+``` 
 
 دعونا نطبق التجزئة على هذه المشكلة. خذ تردد صفيف من حجم 26 و تجزئة الأحرف 26 مع مؤشرات الصفيف باستخدام دالة التجزئة. ثم ، التكرار فوق السلسلة وزيادة القيمة في التردد في الفهرس المقابل لكل حرف. تعقيد هذا الأسلوب هو O (N) حيث N هو حجم السلسلة.
 
@@ -84,15 +88,16 @@ localeTitle: جداول تجزئة
 
 انتاج |
 
- `a 2 
- b 2 
- c 1 
- d 1 
- e 0 
- f 0 
- … 
- z 0 
-` 
+```
+a 2
+b 2
+c 1
+d 1
+e 0
+f 0
+…
+z 0
+``` 
 
 ### تصادم تجزئة
 
diff --git a/guide/arabic/computer-science/data-structures/linked-lists/index.md b/guide/arabic/computer-science/data-structures/linked-lists/index.md
index f0aaee24b0..fbe6a83097 100644
--- a/guide/arabic/computer-science/data-structures/linked-lists/index.md
+++ b/guide/arabic/computer-science/data-structures/linked-lists/index.md
@@ -22,18 +22,19 @@ localeTitle: القوائم المرتبطة
 
 \`\` \` ثابت = حجم ثابت في وقت الإنشاء خطي = مخزن خطيًا في الذاكرة ككتلة واحدة
 
- `#### Arrays have the following disadvantages:- 
- 1. Arrays are static structures and therefore cannot be easily extended or reduced to fit the data set. 
- 2. Arrays are also expensive to maintain new insertions and deletions. 
- 
- Linked Lists address some of the limitations of arrays. Unlike an array, where all the elements are stored in a contiguous block of memory, in a linked list each element is a separate object and has a **link** to the next element in sequence. This allows a linked list to start with space for only one element, and grow to accomodate an arbitrary number of elements by allocating memory as and when needed. 
- 
- Deleting elements is also simply handled by manipulating links. 
- 
- Once you understand the Simple Linked List (which from here on will be referred as **'List'**), you can move on to the Doubly Linked List. 
- 
- A List as illustrated below is made up of the following components:- 
-` 
+```
+#### Arrays have the following disadvantages:-
+1. Arrays are static structures and therefore cannot be easily extended or reduced to fit the data set.
+2. Arrays are also expensive to maintain new insertions and deletions.
+
+Linked Lists address some of the limitations of arrays. Unlike an array, where all the elements are stored in a contiguous block of memory, in a linked list each element is a separate object and has a **link** to the next element in sequence. This allows a linked list to start with space for only one element, and grow to accomodate an arbitrary number of elements by allocating memory as and when needed.
+
+Deleting elements is also simply handled by manipulating links.
+
+Once you understand the Simple Linked List (which from here on will be referred as **'List'**), you can move on to the Doubly Linked List.
+
+A List as illustrated below is made up of the following components:-
+``` 
 
  `     head 
          | 
@@ -125,13 +126,15 @@ void list :: insertBefore (int int) { عقدة N \* node = new N؛ node-> الأ
 
 }
 
- `#### OUTPUT 
-` 
+```
+#### OUTPUT
+``` 
 
 عدد العقد في القائمة = 5 50 40 30 20 10
 
- `#### Explanation 
-` 
+```
+#### Explanation
+``` 
 
 حزب الشعب الكمبودي
 
@@ -165,8 +168,9 @@ void list :: insertBefore (int int) { عقدة N \* node = new N؛ node-> الأ
 
 حزب الشعب الكمبودي قائمة :: قائمة () { رئيس = NULL؛ إنهاء = NULL؛ عد = 0؛ }
 
- `The default constructor is used to initialize the data members of the List class with default values 
-` 
+```
+The default constructor is used to initialize the data members of the List class with default values
+``` 
 
 حزب الشعب الكمبودي void list :: insertBefore (int int) { عقدة N \* node = new N؛ node-> الأسطوانات = البيانات؛ node-> ذيل = NULL؛
 
@@ -246,8 +250,9 @@ void list :: insertBefore (int int) { عقدة N \* node = new N؛ node-> الأ
  } 
 ` 
 
- `Now Execute code 
-` 
+```
+Now Execute code
+``` 
 
 اترك LL = new LinkedList ()؛
 
@@ -258,19 +263,21 @@ void list :: insertBefore (int int) { عقدة N \* node = new N؛ node-> الأ
  console.log(LL); 
 ` 
 
- `Representation in C: 
- A linked list is represented by a pointer to the first node of the linked list. The first node is called head. If the linked list is empty, then value of head is NULL. 
- Each node in a list consists of at least two parts: 
- 1) data 
- 2) pointer to the next node 
- In C, we can represent a node using structures. Below is an example of a linked list node with an integer data. 
- In Java, LinkedList can be represented as a class and a Node as a separate class. The LinkedList class contains a reference of Node class type 
-` 
+```
+Representation in C:
+A linked list is represented by a pointer to the first node of the linked list. The first node is called head. If the linked list is empty, then value of head is NULL.
+Each node in a list consists of at least two parts:
+1) data
+2) pointer to the next node
+In C, we can represent a node using structures. Below is an example of a linked list node with an integer data.
+In Java, LinkedList can be represented as a class and a Node as a separate class. The LinkedList class contains a reference of Node class type
+``` 
 
 C // عقدة قائمة مرتبطة عقدة البنية { بيانات int؛ عقدة البنية \* التالي ؛ }؛
 
- `# Linked List with three elements 
-` 
+```
+# Linked List with three elements
+``` 
 
 ج // برنامج C بسيط لتقديم // قائمة مرتبطة
 
diff --git a/guide/arabic/computer-science/data-structures/stacks/index.md b/guide/arabic/computer-science/data-structures/stacks/index.md
index 374d6772fa..3cd5f71eaf 100644
--- a/guide/arabic/computer-science/data-structures/stacks/index.md
+++ b/guide/arabic/computer-science/data-structures/stacks/index.md
@@ -72,27 +72,29 @@ localeTitle: كومات
 
 على سبيل المثال ، يحتوي مصفوفة في JavaScript على طرق **دفع** و **pop** تسمح لأحد بتطبيق وظائف المكدس بسهولة في أحد التطبيقات.
 
- `stack = []; 
- 
- let i = 0; 
- while(i < 5) 
-  stack.push(i++); 
- 
- while(stack.length) { 
-  stack.pop(); 
- } 
-` 
+```js
+stack = [];
+
+let i = 0;
+while(i < 5)
+  stack.push(i++);
+
+while(stack.length) {
+  stack.pop();
+}
+``` 
 
 يمكن أن تؤدي قائمة في Python أيضًا وظيفة مكدس في أحد التطبيقات. بدلا من **الدفع** ، يمكن للمرء أن يستخدم طريقة **إلحاق** .
 
- `stack = [] 
- 
- for i in range(5): 
-    stack.append(i) 
- 
- while len(stack): 
-    stack.pop() 
-` 
+```python
+stack = []
+
+for i in range(5):
+    stack.append(i)
+
+while len(stack):
+    stack.pop()
+``` 
 
 #### تطبيقات
 
diff --git a/guide/arabic/computer-science/databases/document-store-databases/index.md b/guide/arabic/computer-science/databases/document-store-databases/index.md
index 5c028f66b1..c345139354 100644
--- a/guide/arabic/computer-science/databases/document-store-databases/index.md
+++ b/guide/arabic/computer-science/databases/document-store-databases/index.md
@@ -8,11 +8,12 @@ localeTitle: قواعد بيانات مخزن المستندات
 
 على سبيل المثال ، يمكن أن يكون لدينا الكائن التالي داخل الكود الخاص بنا.
 
- `{ 
-    "name": "freeCodeCamp", 
-    "job": "contributor" 
- } 
-` 
+```json
+{
+    "name": "freeCodeCamp",
+    "job": "contributor"
+}
+``` 
 
 يمكن كتابة هذا الكائن بأكمله مباشرة في قاعدة بيانات مخزن المستندات بدون تحليل إضافي.
 
diff --git a/guide/arabic/computer-science/dynamic-programming/index.md b/guide/arabic/computer-science/dynamic-programming/index.md
index 91f7caefb3..6b0fa5723a 100644
--- a/guide/arabic/computer-science/dynamic-programming/index.md
+++ b/guide/arabic/computer-science/dynamic-programming/index.md
@@ -16,13 +16,14 @@ localeTitle: برمجة ديناميكية
 
 لحساب F (5) ستحتاج إلى حساب عدة مرات نفس F (i). استخدام العودية:
 
- `def fib(n) 
- { 
-    if n <= 1: 
-        return n 
-    return fib(n-1) + fib(n-2); 
- } 
-` 
+```python
+def fib(n)
+{
+    if n <= 1:
+        return n
+    return fib(n-1) + fib(n-2);
+}
+``` 
 
 وفيما يلي الحل الأمثل (باستخدام DP)
 
@@ -30,17 +31,18 @@ localeTitle: برمجة ديناميكية
 
 هنا هو الحل الأمثل الذي يستخدم DP و memoization:
 
- `lookup = {1 : 1, 2 : 1} # Create a lookup-table (a map) inizialized with the first 2 Fibonacci's numbers 
- 
- def fib(n) 
- { 
-    if n in lookup: # If n is already computed 
-        return n # Return the previous computed solution 
-    else 
-        lookup[n] = fib(n-1) + fib(n-2) # Else, do the recursion. 
-    return lookup[n] 
- } 
-` 
+```python
+lookup = {1 : 1, 2 : 1} # Create a lookup-table (a map) inizialized with the first 2 Fibonacci's numbers
+
+def fib(n)
+{
+    if n in lookup: # If n is already computed
+        return n # Return the previous computed solution
+    else
+        lookup[n] = fib(n-1) + fib(n-2) # Else, do the recursion.
+    return lookup[n]
+}
+``` 
 
 التخزين المؤقت للحلول المحسوبة في جدول البحث ، والاستعلام عنها قبل الذهاب العودية سيتيح للبرنامج وقت تشغيل O (N).
 
diff --git a/guide/arabic/computer-science/garbage-collection/index.md b/guide/arabic/computer-science/garbage-collection/index.md
index 2ce54e4ac5..fe19e3e794 100644
--- a/guide/arabic/computer-science/garbage-collection/index.md
+++ b/guide/arabic/computer-science/garbage-collection/index.md
@@ -30,14 +30,15 @@ localeTitle: جمع القمامة
 
 إذا كان الكائن لا يحتوي على مراجع (لم يعد قابلاً للوصول) ، فهو مؤهل لجمع البيانات المهملة. على سبيل المثال ، في رمز Java الموجود أدناه ، يحتوي كائن Thing الذي تمت الإشارة إليه أصلاً بواسطة 'thing1' على مرجع واحد ومرجع فقط إلى كائن آخر على الكومة - ثم يتعذر الوصول إليه وسيتوفر ذاكرة غير مخصصة من قبل أداة تجميع مجمعي البيانات المهملة.
 
- `class Useless { 
-  public static void main (String[] args) { 
-  Thing thing1 = new Thing(); 
-  Thing thing2 = new Thing(); 
-  thing2 = thing1; // direct thing2's reference towards thing1 
-                   // no references access thing2 
- } } 
-` 
+```java
+class Useless {
+  public static void main (String[] args) {
+  Thing thing1 = new Thing();
+  Thing thing2 = new Thing();
+  thing2 = thing1; // direct thing2's reference towards thing1
+                   // no references access thing2
+} }
+``` 
 
 أحد الأمثلة على جمع البيانات المهملة هو ARC ، باختصار لحساب المراجع الأوتوماتيكي. هذا يستخدم في سويفت ، على سبيل المثال. ARC يتلخص لتتبع المراجع إلى جميع الكائنات التي يتم إنشاؤها. إذا انخفض مقدار المراجع إلى 0 ، فسيتم وضع علامة على الكائن لإلغاء تخصيصه.
 
diff --git a/guide/arabic/computer-science/hexcode/index.md b/guide/arabic/computer-science/hexcode/index.md
index eccbcac6cd..01d49d9d98 100644
--- a/guide/arabic/computer-science/hexcode/index.md
+++ b/guide/arabic/computer-science/hexcode/index.md
@@ -14,12 +14,13 @@ localeTitle: الأرقام السداسية العشرية
 
 ### أمثلة وشرح
 
- `0x1        ==        1 
- 0xF        ==        15 
- 0xFF       ==        255 
- 0xFFF      ==        4095 
- 0x1000     ==        4096 
-` 
+```
+0x1        ==        1
+0xF        ==        15
+0xFF       ==        255
+0xFFF      ==        4095
+0x1000     ==        4096
+``` 
 
 في النظام الأساسي الأساسي 10 ، يمثل كل عمود زيادة الصلاحيات 10 ، بينما في 16 قاعدة يمثل كل عمود زيادة الصلاحيات 16.
 
@@ -49,11 +50,12 @@ localeTitle: الأرقام السداسية العشرية
 
 تستخدم CSS لفترة طويلة ترميزًا سداسيًا عشريًا لتمثيل قيم الألوان. خذ بعين الاعتبار المحدد التالي:
 
- `.my-container { 
-    background-color: #112233; 
-    color: #FFFFFF; 
- } 
-` 
+```css
+.my-container {
+    background-color: #112233;
+    color: #FFFFFF;
+}
+``` 
 
 قيمة `background-color` هي في الواقع ثلاث بايت عرافة.
 
diff --git a/guide/arabic/computer-science/notation/big-theta-notation/index.md b/guide/arabic/computer-science/notation/big-theta-notation/index.md
index ac3259c777..61d36f6fbf 100644
--- a/guide/arabic/computer-science/notation/big-theta-notation/index.md
+++ b/guide/arabic/computer-science/notation/big-theta-notation/index.md
@@ -8,12 +8,13 @@ localeTitle: كبير ثيتا التدوين
 
 لنأخذ على سبيل المثال وظيفة تبحث عن مصفوفة للقيمة 0:
 
- `def containsZero(arr): #assume normal array of length n with no edge cases 
-  for num x in arr: 
-    if x == 0: 
-       return true 
-  return false 
-` 
+```python
+def containsZero(arr): #assume normal array of length n with no edge cases
+  for num x in arr:
+    if x == 0:
+       return true
+  return false
+``` 
 
 1.  ما هي أفضل حالة؟ حسنًا ، إذا كانت الصفيف الذي نوفره له 0 كقيمة أولى ، فسيستغرق ذلك وقتًا ثابتًا: Ω (1)
 2.  ما هي أسوأ حالة؟ إذا كان المصفوفة لا تحتوي على 0 ، فسنقوم بتكرارها من خلال المصفوفة بأكملها: O (n)
@@ -22,10 +23,11 @@ localeTitle: كبير ثيتا التدوين
 
 دعونا نغير كودنا قليلا.
 
- `def printNums(arr): #assume normal array of length n with no edge cases 
-  for num x in arr: 
-    print(x) 
-` 
+```python
+def printNums(arr): #assume normal array of length n with no edge cases
+  for num x in arr:
+    print(x)
+``` 
 
 يمكنك التفكير في أفضل حالة وأسوأ حالة ؟؟ لا استطيع بصرف النظر عن المجموعة التي نوفرها ، يجب علينا التكرار من خلال كل قيمة في الصفيف. وبالتالي فإن الدالة ستستغرق وقتًا قصيرًا (Ω (n)) ، لكننا نعرف أيضًا أنها لن تستغرق أكثر من وقت n (O (n)). ماذا يعني هذا؟ سوف تأخذ **وظيفتنا بالضبط** وقت n: Θ (n).
 
diff --git a/guide/arabic/computer-science/what-is-an-api/index.md b/guide/arabic/computer-science/what-is-an-api/index.md
index cc5c9ada7b..092ab8c7f1 100644
--- a/guide/arabic/computer-science/what-is-an-api/index.md
+++ b/guide/arabic/computer-science/what-is-an-api/index.md
@@ -14,23 +14,24 @@ API لتقف على واجهة برمجة التطبيقات. تعمل واجه
 
 يعني الوصول إلى API بشكل عام أن يكون لديك إمكانية الوصول إلى كمية كبيرة من البيانات المنظمة. يوفر برنامج حماية البوابة البيانات إذن المطور (في شكل _مفتاح API_ ) للاستعلام عن خادم للحصول على معلومات. إذا كان الطلب ناجحًا ، يستجيب الخادم برسالة قد تبدو كالتالي:
 
- `{ 
-  "coord": { 
-    "lon":139, 
-    "lat":35 
-  }, 
-  "wind": { 
-    "speed":7.31, 
-    "deg":187.002 
-  }, 
-  "rain": { 
-    "3h":0 
-  }, 
-  "clouds": { 
-    "all":92 
-  } 
- } 
-` 
+```javascript
+{
+  "coord": {
+    "lon":139,
+    "lat":35
+  },
+  "wind": {
+    "speed":7.31,
+    "deg":187.002
+  },
+  "rain": {
+    "3h":0
+  },
+  "clouds": {
+    "all":92
+  }
+}
+``` 
 
 المصدر: [Open Weather API](https://openweathermap.org/current)
 
diff --git a/guide/arabic/containers/docker/creating-a-new-container/index.md b/guide/arabic/containers/docker/creating-a-new-container/index.md
index 10546ab19f..0df5073bfa 100644
--- a/guide/arabic/containers/docker/creating-a-new-container/index.md
+++ b/guide/arabic/containers/docker/creating-a-new-container/index.md
@@ -4,12 +4,14 @@ localeTitle: إنشاء حاوية جديدة
 ---
 إنشاء حاوية باستخدام Docker CLI
 
- `docker create [OPTIONS] IMAGE [COMMAND] [ARG...] 
-` 
+```yaml
+docker create [OPTIONS] IMAGE [COMMAND] [ARG...]
+``` 
 
 # أمثلة
 
 إنشاء وبدء حاوية
 
- `$ docker create -t -i fedora bash 
-`
\ No newline at end of file
+```sh
+$ docker create -t -i fedora bash
+```
\ No newline at end of file
diff --git a/guide/arabic/containers/docker/index.md b/guide/arabic/containers/docker/index.md
index 93d5b7e8d6..e1e63ccf52 100644
--- a/guide/arabic/containers/docker/index.md
+++ b/guide/arabic/containers/docker/index.md
@@ -10,22 +10,24 @@ localeTitle: عامل ميناء
 
 بعد الانتهاء من إعداد جهاز الكمبيوتر الخاص بك و docker dockig ، يمكنك ببساطة اختبار Docker الخاص بك عن طريق تشغيل الأمر:
 
- `$ docker run hello-world 
- Unable to find image 'hello-world:latest' locally 
- latest: Pulling from library/hello-world 
- ca4f61b1923c: Pull complete 
- Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
- Status: Downloaded newer image for hello-world:latest 
- 
- Hello from Docker! 
- This message shows that your installation appears to be working correctly. 
- ... 
-` 
+```shell
+$ docker run hello-world
+Unable to find image 'hello-world:latest' locally
+latest: Pulling from library/hello-world
+ca4f61b1923c: Pull complete
+Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7
+Status: Downloaded newer image for hello-world:latest
+
+Hello from Docker!
+This message shows that your installation appears to be working correctly.
+...
+``` 
 
 إذا لم يكن لديك صورة hello-world محليًا ، فسيقوم Docker بتنزيلها تلقائيًا على جهازك. يمكنك إدراج الصورة التي تم تنزيلها أو إنشاؤها على جهازك عن طريق تشغيل الأمر:
 
- `$ docker image ls 
-` 
+```shell
+$ docker image ls
+``` 
 
 يحتوي [متجر Docker Store](https://hub.docker.com/explore/) على العديد من التطبيقات الشائعة المجمعة في حاويات وجاهزة للاستخدام.
 
diff --git a/guide/arabic/containers/run-your-first-docker-image/index.md b/guide/arabic/containers/run-your-first-docker-image/index.md
index 9e3b41246c..519f4e84d3 100644
--- a/guide/arabic/containers/run-your-first-docker-image/index.md
+++ b/guide/arabic/containers/run-your-first-docker-image/index.md
@@ -6,22 +6,24 @@ localeTitle: تشغيل أول صورة عامل الميناء الخاص بك
 
 بعد الانتهاء من إعداد جهاز الكمبيوتر الخاص بك و docker dockig ، يمكنك ببساطة اختبار Docker الخاص بك عن طريق تشغيل الأمر:
 
- `$ docker run hello-world 
- Unable to find image 'hello-world:latest' locally 
- latest: Pulling from library/hello-world 
- ca4f61b1923c: Pull complete 
- Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
- Status: Downloaded newer image for hello-world:latest 
- 
- Hello from Docker! 
- This message shows that your installation appears to be working correctly. 
- ... 
-` 
+```shell
+$ docker run hello-world
+Unable to find image 'hello-world:latest' locally
+latest: Pulling from library/hello-world
+ca4f61b1923c: Pull complete
+Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7
+Status: Downloaded newer image for hello-world:latest
+
+Hello from Docker!
+This message shows that your installation appears to be working correctly.
+...
+``` 
 
 إذا لم يكن لديك صورة hello-world محليًا ، فسيقوم Docker بتنزيلها تلقائيًا على جهازك. يمكنك إدراج الصورة التي تم تنزيلها أو إنشاؤها على جهازك عن طريق تشغيل الأمر:
 
- `$ docker image ls 
-` 
+```shell
+$ docker image ls
+``` 
 
 معلومات اكثر:
 
diff --git a/guide/arabic/cplusplus/casting/index.md b/guide/arabic/cplusplus/casting/index.md
index 1d41b5ad65..1ea8a549a2 100644
--- a/guide/arabic/cplusplus/casting/index.md
+++ b/guide/arabic/cplusplus/casting/index.md
@@ -38,49 +38,50 @@ localeTitle: صب
 
 ## أمثلة
 
- `#include <iostream> 
- 
- class MyClass { 
- public: 
-    virtual ~MyClass() = default; 
- 
-    void greet() { 
-        std::cout << "Hello World!" << std::endl; 
-    } 
- }; 
- 
- class MyClassChild : public MyClass { 
- }; 
- 
- void reinterpretCastTest(void *objectPtr) { 
-    // Let's assume we know objectPtr is of type MyClass * 
-    auto myClassObj = reinterpret_cast<MyClassChild *>(objectPtr); 
-    myClassObj->greet(); 
- } 
- 
- void constCastTest(const MyClassChild &myClassChild) { 
-    auto nonConst = const_cast<MyClassChild &>(myClassChild); 
-    nonConst.greet(); 
- } 
- 
- void dynamicCastTest(MyClass *myClass) { 
-    auto *child = dynamic_cast<MyClassChild *>(myClass); 
-    child->greet(); 
- } 
- 
- void staticCastTest(float floatVal) { 
-    // Convert the float into an int. 
-    auto intVal = static_cast<int>(floatVal); 
-    std::cout << intVal << std::endl; 
- } 
- 
- int main() { 
-    MyClassChild myClass; 
-    reinterpretCastTest(&myClass); 
-    constCastTest(myClass); 
-    dynamicCastTest(&myClass); 
-    staticCastTest(10.5); 
- 
-    return 0; 
- } 
-`
\ No newline at end of file
+```cpp
+#include <iostream>
+
+class MyClass {
+public:
+    virtual ~MyClass() = default;
+
+    void greet() {
+        std::cout << "Hello World!" << std::endl;
+    }
+};
+
+class MyClassChild : public MyClass {
+};
+
+void reinterpretCastTest(void *objectPtr) {
+    // Let's assume we know objectPtr is of type MyClass *
+    auto myClassObj = reinterpret_cast<MyClassChild *>(objectPtr);
+    myClassObj->greet();
+}
+
+void constCastTest(const MyClassChild &myClassChild) {
+    auto nonConst = const_cast<MyClassChild &>(myClassChild);
+    nonConst.greet();
+}
+
+void dynamicCastTest(MyClass *myClass) {
+    auto *child = dynamic_cast<MyClassChild *>(myClass);
+    child->greet();
+}
+
+void staticCastTest(float floatVal) {
+    // Convert the float into an int.
+    auto intVal = static_cast<int>(floatVal);
+    std::cout << intVal << std::endl;
+}
+
+int main() {
+    MyClassChild myClass;
+    reinterpretCastTest(&myClass);
+    constCastTest(myClass);
+    dynamicCastTest(&myClass);
+    staticCastTest(10.5);
+
+    return 0;
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/cplusplus/clean-code-guidelines/index.md b/guide/arabic/cplusplus/clean-code-guidelines/index.md
index 41e1181b70..73d69a8000 100644
--- a/guide/arabic/cplusplus/clean-code-guidelines/index.md
+++ b/guide/arabic/cplusplus/clean-code-guidelines/index.md
@@ -18,12 +18,13 @@ localeTitle: تعليمات كود نظيفة
 
 بدلاً من استخدام المتغيرات العامة ، يمكنك استخدام المتغيرات التي تم الإعلان عنها في الوظائف والتي يمكن أن تساعدك في تحديد القيم التي يتم تمريرها وتحديد الأخطاء بشكل أسرع.
 
- `#include <iostream> 
- using namespace std; 
- 
- // Global variables are declared outside functions 
- int cucumber; // global variable "cucumber" 
-` 
+```cpp
+#include <iostream>
+using namespace std;
+
+// Global variables are declared outside functions
+int cucumber; // global variable "cucumber"
+``` 
 
 ## استخدام الانتقال والمتابعة وما إلى ذلك.
 
@@ -39,27 +40,29 @@ localeTitle: تعليمات كود نظيفة
 
 عادة ما تكون هناك أعمال حول هذا تبدو أكثر وضوحا وأقل إرباكا ، على سبيل المثال. بينما الحلقات. فعل:
 
- `int i=1; 
- while (i <= 5) 
- { 
-    if (i == 2) 
-        i = 4; 
- 
-    ++i; 
- } 
-` 
+```cpp
+int i=1;
+while (i <= 5)
+{
+    if (i == 2)
+        i = 4;
+
+    ++i;
+}
+``` 
 
 بدلا من:
 
- `for (int i = 1; i <= 5; i++) 
- { 
-    if (i == 2) 
-    { 
-       i = 4; 
-    } 
-    // Do work 
- } 
-` 
+```cpp
+for (int i = 1; i <= 5; i++)
+{
+    if (i == 2)
+    {
+       i = 4;
+    }
+    // Do work
+}
+``` 
 
 ## أعلن الثوابت وأنواع في الجزء العلوي
 
@@ -75,17 +78,19 @@ localeTitle: تعليمات كود نظيفة
 
 بدلا من:
 
- `for (int i = 1; i <= 5; i++) 
-    //CODE 
-` 
+```cpp
+for (int i = 1; i <= 5; i++)
+    //CODE
+``` 
 
 فعل:
 
- `for (int i = 1; i <= 5; i++) 
- { 
-    //CODE 
- } 
-` 
+```cpp
+for (int i = 1; i <= 5; i++)
+{
+    //CODE
+}
+``` 
 
 ## توصيات أخرى
 
@@ -96,7 +101,8 @@ localeTitle: تعليمات كود نظيفة
 *   \#### كتابة const في أحرف استهلالية ، أنواع البيانات تبدأ بـ T والمتغيرات في الحالة الصغيرة.
     
 
- `const int MAX= 100;             //Constant 
- typedef int TVector[MAX];       //Data type 
- TVector vector;                 //Vector 
-`
\ No newline at end of file
+```cpp
+const int MAX= 100;             //Constant
+typedef int TVector[MAX];       //Data type
+TVector vector;                 //Vector
+```
\ No newline at end of file
diff --git a/guide/arabic/cplusplus/conditional-operator/index.md b/guide/arabic/cplusplus/conditional-operator/index.md
index f384365dd8..56bf0c1cff 100644
--- a/guide/arabic/cplusplus/conditional-operator/index.md
+++ b/guide/arabic/cplusplus/conditional-operator/index.md
@@ -13,26 +13,28 @@ localeTitle: مشغل شرطي
 
 هنا ، يتم تقييم expression-1 عندما يكون الشرط صحيحًا ويتم تقييم expression-2 عندما تكون condtion خاطئة. عبارة if-else مشابهة ستكون:
 
- `if(condition) 
-  { 
-    expression-1; 
-  } 
- else 
-  { 
-    expression-2; 
-  } 
-` 
+```cpp
+if(condition)
+  {
+    expression-1;
+  }
+else
+  {
+    expression-2;
+  }
+``` 
 
 ومن ثم فإن العامل الشرطي سهل للغاية عندما تحتاج إلى كتابة عبارة if-else بسيطة. ويمكن أيضا أن تستخدم في # تعريف preprocessor عندما يتم استخدام حالة مماثلة في أماكن متعددة.
 
 على سبيل المثال ، يمكن استخدام الحد الأقصى لعدد المشغلين الشرطيين على النحو التالي:
 
- `#define big(a,b) (a>=b)?a:b 
- 
- int maximum,x=5,y=6; // variable to store maximum of two numbers 
- maximum=(x>y)?x:y; // directly using conditional operator 
- maximum=big(x,y); // using the #define preprocessor defined above as big 
-` 
+```cpp
+#define big(a,b) (a>=b)?a:b
+
+int maximum,x=5,y=6; // variable to store maximum of two numbers
+maximum=(x>y)?x:y; // directly using conditional operator
+maximum=big(x,y); // using the #define preprocessor defined above as big
+``` 
 
 **حظا سعيدا لكم جميعا**
 
diff --git a/guide/arabic/cplusplus/erase-remove/index.md b/guide/arabic/cplusplus/erase-remove/index.md
index acfe0b6703..efe89bc000 100644
--- a/guide/arabic/cplusplus/erase-remove/index.md
+++ b/guide/arabic/cplusplus/erase-remove/index.md
@@ -8,24 +8,25 @@ localeTitle: مسح-إزالة لغة
 
 ### مقارنة
 
- `// Using a hand-written loop 
- std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
- for (auto iter = v.cbegin(); iter < v.cend(); /*iter++*/) 
- { 
-    if (is_odd(*iter)) 
-    { 
-        iter = v.erase(iter); 
-    } 
-    else 
-    { 
-        ++iter; 
-    } 
- } 
- 
- // Using the erase–remove idiom 
- std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
- v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end()); 
-` 
+```cpp
+// Using a hand-written loop
+std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 };
+for (auto iter = v.cbegin(); iter < v.cend(); /*iter++*/)
+{
+    if (is_odd(*iter))
+    {
+        iter = v.erase(iter);
+    }
+    else
+    {
+        ++iter;
+    }
+}
+
+// Using the erase–remove idiom
+std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 };
+v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end());
+``` 
 
 كما ترون ، يتطلب التعليمة البرمجية ذات حلقة مكتوبة يدويًا كتابة أكثر قليلاً ، ولكن لها أيضًا مشكلة في الأداء. يجب أن تقوم كل مكالمة `erase` بتحويل جميع العناصر بعد المحذوفة ، لتجنب "الفجوات" في المجموعة. داعيا `erase` عدة مرات على نفس الحاوية يولد الكثير من النفقات العامة من تحريك العناصر.
 
@@ -33,51 +34,52 @@ localeTitle: مسح-إزالة لغة
 
 ### مثال
 
- `#include <vector> // the general-purpose vector container 
- #include <iostream> // cout 
- #include <algorithm> // remove and remove_if 
- 
- bool is_odd(int i) 
- { 
-    return (i % 2) != 0; 
- } 
- 
- void print(const std::vector<int> &vec) 
- { 
-    for (const auto& i : vec) 
-        std::cout << i << ' '; 
-    std::cout << std::endl; 
- } 
- 
- int main() 
- { 
-    // initializes a vector that holds the numbers from 1-10. 
-    std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
-    print(v); 
- 
-    // removes all elements with the value 5 
-    v.erase(std::remove(v.begin(), v.end(), 5), v.end()); 
-    print(v); 
- 
-    // removes all odd numbers 
-    v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end()); 
-    print(v); 
- 
-    // removes multiples of 4 using lambda 
-    v.erase(std::remove_if(v.begin(), v.end(), [](int n) { return (n % 4) == 0; }), v.end()); 
-    print(v); 
- 
-    return 0; 
- } 
- 
- /* 
- Output: 
- 1 2 3 4 5 6 7 8 9 10 
- 1 2 3 4 6 7 8 9 10 
- 2 4 6 8 10 
- 2 6 10 
- */ 
-` 
+```cpp
+#include <vector> // the general-purpose vector container
+#include <iostream> // cout
+#include <algorithm> // remove and remove_if
+
+bool is_odd(int i)
+{
+    return (i % 2) != 0;
+}
+
+void print(const std::vector<int> &vec)
+{
+    for (const auto& i : vec)
+        std::cout << i << ' ';
+    std::cout << std::endl;
+}
+
+int main()
+{
+    // initializes a vector that holds the numbers from 1-10.
+    std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 };
+    print(v);
+
+    // removes all elements with the value 5
+    v.erase(std::remove(v.begin(), v.end(), 5), v.end());
+    print(v);
+
+    // removes all odd numbers
+    v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end());
+    print(v);
+
+    // removes multiples of 4 using lambda
+    v.erase(std::remove_if(v.begin(), v.end(), [](int n) { return (n % 4) == 0; }), v.end());
+    print(v);
+
+    return 0;
+}
+
+/*
+Output:
+1 2 3 4 5 6 7 8 9 10
+1 2 3 4 6 7 8 9 10
+2 4 6 8 10
+2 6 10
+*/
+``` 
 
 ### مصادر
 
diff --git a/guide/arabic/cplusplus/for-loop/index.md b/guide/arabic/cplusplus/for-loop/index.md
index 4ce2f51cce..0308854210 100644
--- a/guide/arabic/cplusplus/for-loop/index.md
+++ b/guide/arabic/cplusplus/for-loop/index.md
@@ -10,18 +10,20 @@ A For Loop هو عبارة تكرارية تستخدم للتحقق من وجو
 
 ## بناء الجملة
 
- `for ( init; condition; increment ) { 
-   statement(s); 
- } 
-` 
+```
+for ( init; condition; increment ) {
+   statement(s);
+}
+``` 
 
 من المسموح به لوضع الزيادة insie للحلقة مثل في حلقة في حين. بمعنى أن بناء الجملة مثل هذا يمكن أن يعمل أيضًا.
 
- `for ( init; condition;) { 
-   statement(s); 
-   increment; 
- } 
-` 
+```
+for ( init; condition;) {
+   statement(s);
+   increment;
+}
+``` 
 
 ### فيه
 
diff --git a/guide/arabic/cplusplus/functions/index.md b/guide/arabic/cplusplus/functions/index.md
index 79aa0d98f7..8d95b5314b 100644
--- a/guide/arabic/cplusplus/functions/index.md
+++ b/guide/arabic/cplusplus/functions/index.md
@@ -10,11 +10,12 @@ localeTitle: وظائف في C ++
 
 ## الشكل العام لتعريف الدالة C ++:
 
- `return_type function_name( parameter list ) 
- { 
-   body of the function 
- } 
-` 
+```cpp
+return_type function_name( parameter list )
+{
+   body of the function
+}
+``` 
 
 ### نوع الإرجاع:
 
@@ -34,19 +35,20 @@ localeTitle: وظائف في C ++
 
 ## مثال:
 
- `int max(int num1, int num2) 
- { 
-   // local variable declaration 
-   int result; 
- 
-   if (num1 > num2) 
-      result = num1; 
-   else 
-      result = num2; 
- 
-   return result; 
- } 
-` 
+```cpp
+int max(int num1, int num2)
+{
+   // local variable declaration
+   int result;
+
+   if (num1 > num2)
+      result = num1;
+   else
+      result = num2;
+
+   return result;
+}
+``` 
 
 ## لماذا تعتبر الوظائف مهمة؟
 
diff --git a/guide/arabic/cplusplus/inline-function/index.md b/guide/arabic/cplusplus/inline-function/index.md
index da845e435a..0ffa6c402d 100644
--- a/guide/arabic/cplusplus/inline-function/index.md
+++ b/guide/arabic/cplusplus/inline-function/index.md
@@ -24,12 +24,13 @@ localeTitle: وظيفة مضمنة
 
 }
 
- `## When to use Inline function 
- 
- * When the function performs small tasks and is called very often. 
- * When performance is important. 
- * Instead of a macro. 
-` 
+```
+## When to use Inline function
+
+* When the function performs small tasks and is called very often.
+* When performance is important.
+* Instead of a macro.
+``` 
 
 ج ++
 
diff --git a/guide/arabic/cplusplus/inline-functions/index.md b/guide/arabic/cplusplus/inline-functions/index.md
index 0e388c851e..26a628a382 100644
--- a/guide/arabic/cplusplus/inline-functions/index.md
+++ b/guide/arabic/cplusplus/inline-functions/index.md
@@ -8,11 +8,12 @@ localeTitle: وظائف مضمنة في C ++
 
 يوفر C ++ وظائف مضمّنة لتقليل الحمل المكالمة الدالة. دالة مضمنة هي دالة يتم توسيعها في السطر عندما يتم استدعاؤها. عندما يتم استدعاء الدالة المضمنة يتم إدخال رمز كامل للدالة المضمنة أو استبدالها في نقطة استدعاء دالة مضمنة. يتم تنفيذ هذا الاستبدال بواسطة برنامج التحويل البرمجي C ++ في وقت التحويل البرمجي. وظيفة مضمنة قد تزيد من الكفاءة إذا كانت صغيرة. إن صيغة تعريف الدالة المضمنة هي:
 
- `inline return-type function-name(parameters) 
- { 
-    // function code 
- } 
-` 
+```cpp
+inline return-type function-name(parameters)
+{
+    // function code
+}
+``` 
 
 تذكر أن التضمين هو مجرد طلب إلى المحول البرمجي وليس أمرًا. يمكن تجاهل المحول البرمجي طلب forlining. قد لا يؤدّي المحول البرمجي inlining في حالات مثل:
 
@@ -107,10 +108,11 @@ localeTitle: وظائف مضمنة في C ++
 
 انتاج:
 
- `Enter first value: 45 
- Enter second value: 15 
- Addition of two numbers: 60 
- Difference of two numbers: 30 
- Product of two numbers: 675 
- Division of two numbers: 3 
-`
\ No newline at end of file
+```
+Enter first value: 45
+Enter second value: 15
+Addition of two numbers: 60
+Difference of two numbers: 30
+Product of two numbers: 675
+Division of two numbers: 3
+```
\ No newline at end of file
diff --git a/guide/arabic/cplusplus/loops/index.md b/guide/arabic/cplusplus/loops/index.md
index 8958182011..7d0d7b0f82 100644
--- a/guide/arabic/cplusplus/loops/index.md
+++ b/guide/arabic/cplusplus/loops/index.md
@@ -10,32 +10,35 @@ localeTitle: الحلقات
 
 \`\` \`ج + + cout << 0 << endl؛ cout << 2 << endl؛ cout << 4 << endl؛ .... .... .... cout << 1000 << endl؛
 
- `But the problem with this approach is that you have to write the same line again and again. And if suppose you have to print 
- prime numbers from 1 to 1000 then this will be more hectic. 
- Therefore, in order to solve such problems loops are introduced. 
- 
- There are different types of loop functions: 
- ### While and do while loops 
- 
- While and do while loops allow you to make the loop until a condition finishes. 
- The difference between While and Do while is that Do while always executes once. 
- Here you can see an example: 
-` 
+```
+But the problem with this approach is that you have to write the same line again and again. And if suppose you have to print
+prime numbers from 1 to 1000 then this will be more hectic.
+Therefore, in order to solve such problems loops are introduced.
+
+There are different types of loop functions:
+### While and do while loops
+
+While and do while loops allow you to make the loop until a condition finishes.
+The difference between While and Do while is that Do while always executes once.
+Here you can see an example:
+``` 
 
 ج ++ بينما (الشرط) { // القانون الذي سيتم تنفيذه في حين الشرط هو الصحيح } فعل { // سيتم التنفيذ مرة واحدة وحتى تصبح الحالة خاطئة } في حين (شرط) ؛
 
- `### For loops 
- 
- For loops are usually used when you know how many times the code will execute. 
- The flow can be seen in this [graph](https://www.tutorialspoint.com/cplusplus/images/cpp_for_loop.jpg). 
- 
- They are declared this way: 
-` 
+```
+### For loops
+
+For loops are usually used when you know how many times the code will execute.
+The flow can be seen in this [graph](https://www.tutorialspoint.com/cplusplus/images/cpp_for_loop.jpg).
+
+They are declared this way:
+``` 
 
 ج ++ لـ (تهيئة متغير ؛ تحقق من شرط ؛ زيادة المتغير الذي تم تهيئته) { // رمز التنفيذ }
 
- `Lets write a program which will print numbers from 0 to 1000 including 1000 on the screen using a for loop. 
-` 
+```
+Lets write a program which will print numbers from 0 to 1000 including 1000 on the screen using a for loop.
+``` 
 
 ج ++ لـ (int i = 0؛ i <= 1000؛ i ++) { cout << i << endl؛ }
 
diff --git a/guide/arabic/cplusplus/map/index.md b/guide/arabic/cplusplus/map/index.md
index 945fffb1b1..830dbe857e 100644
--- a/guide/arabic/cplusplus/map/index.md
+++ b/guide/arabic/cplusplus/map/index.md
@@ -41,11 +41,12 @@ localeTitle: خريطة
 
 انتاج:
 
- `a => 10 
- b => 20 
- c => 30 
- d => 40 
-` 
+```
+a => 10
+b => 20
+c => 30
+d => 40
+``` 
 
 ## خلق كائن الخريطة
 
diff --git a/guide/arabic/cplusplus/object-oriented-programming/index.md b/guide/arabic/cplusplus/object-oriented-programming/index.md
index 0f3792ac55..e6e1d5c6f5 100644
--- a/guide/arabic/cplusplus/object-oriented-programming/index.md
+++ b/guide/arabic/cplusplus/object-oriented-programming/index.md
@@ -12,19 +12,20 @@ localeTitle: البرمجة الشيئية باستخدام C ++
 
 الكائنات هي كيانات وقت التشغيل الأساسية في نظام موجه للكائنات ، والكائنات هي مثيلات للفئة يتم تعريف هذه أنواع البيانات المعرفة من قبل المستخدم.
 
- `class person 
- { 
-    char name[20]; 
-    int id; 
- public: 
-    void getdetails(){} 
- }; 
- 
- int main() 
- { 
-   person p1; //p1 is an object 
- } 
-` 
+```cpp
+class person
+{
+    char name[20];
+    int id;
+public:
+    void getdetails(){}
+};
+
+int main()
+{
+   person p1; //p1 is an object
+}
+``` 
 
 تشغل الكائنات مساحة في الذاكرة ويكون لها عنوان مرتبط مثل سجل في الباسكال أو البنية أو الاتحاد في C.
 
@@ -36,16 +37,17 @@ localeTitle: البرمجة الشيئية باستخدام C ++
 
 الصف هو مخطط للبيانات والوظائف أو الطرق. الطبقة لا تأخذ أي مساحة.
 
- `class class_name 
- { 
-  private: 
-     //data members and member functions declarations 
-  public: 
-     //data members and member functions declarations 
-  protected: 
-     //data members and member functions declarations 
- }; 
-` 
+```cpp
+class class_name
+{
+  private:
+     //data members and member functions declarations
+  public:
+     //data members and member functions declarations
+  protected:
+     //data members and member functions declarations
+};
+``` 
 
 Class هو نوع بيانات محدد بواسطة المستخدم مثل بنيات ونقابات في C.
 
diff --git a/guide/arabic/cplusplus/overloading/index.md b/guide/arabic/cplusplus/overloading/index.md
index 2170776d12..0a7b9478db 100644
--- a/guide/arabic/cplusplus/overloading/index.md
+++ b/guide/arabic/cplusplus/overloading/index.md
@@ -49,10 +49,11 @@ localeTitle: C ++ التحميل الزائد
 
 عندما يتم تجميع التعليمات البرمجية المذكورة أعلاه وتنفيذها ، فإنها تنتج النتيجة التالية -
 
- `Printing int: 5 
- Printing float: 500.263 
- Printing string: Hello C++ 
-` 
+```
+Printing int: 5
+Printing float: 500.263
+Printing string: Hello C++
+``` 
 
 ### مشغل الحمولة الزائدة في C ++
 
@@ -96,5 +97,6 @@ localeTitle: C ++ التحميل الزائد
 
 الناتج عن البرنامج أعلاه
 
- `4 + i3 
-`
\ No newline at end of file
+```
+4 + i3
+```
\ No newline at end of file
diff --git a/guide/arabic/cplusplus/random-functions/index.md b/guide/arabic/cplusplus/random-functions/index.md
index 4c9d4af251..9d97074ed5 100644
--- a/guide/arabic/cplusplus/random-functions/index.md
+++ b/guide/arabic/cplusplus/random-functions/index.md
@@ -57,16 +57,17 @@ rand (): - _إرجاع رقم **pseudo-random** (عدد صحيح) من 0 إلى
 
 مقتطف الشفرة:
 
- `#include <ctime> 
- 
- srand(time(NULL)); 
- cout << rand(); 
- 
- /* 
- Output: (Will differ from computer to computer, and because of the seed, will also differ from time to time, literally. :D) 
- 1696269016 
- */ 
-` 
+```cpp
+#include <ctime>
+
+srand(time(NULL));
+cout << rand();
+
+/*
+Output: (Will differ from computer to computer, and because of the seed, will also differ from time to time, literally. :D)
+1696269016
+*/
+``` 
 
 هذا ينتج قيم مختلفة في كل مرة يتم تشغيل البرنامج.
 
diff --git a/guide/arabic/cplusplus/range-for-loop/index.md b/guide/arabic/cplusplus/range-for-loop/index.md
index c8dbbec578..c145a9a39b 100644
--- a/guide/arabic/cplusplus/range-for-loop/index.md
+++ b/guide/arabic/cplusplus/range-for-loop/index.md
@@ -8,20 +8,22 @@ localeTitle: نطاق للحلقة
 
 مع التقليدية `for` حلقة:
 
- `std::vector<std::string> stringList {"one", "two", "three"}; 
- 
- for (size_t il; il < stringList.size(); il++ 
- { 
-  std::cout << stringList.at(il) << std::endl; 
- } 
-` 
+```cpp
+std::vector<std::string> stringList {"one", "two", "three"};
+
+for (size_t il; il < stringList.size(); il++
+{
+  std::cout << stringList.at(il) << std::endl;
+}
+``` 
 
 مع مجموعة المستندة `for` حلقة:
 
- `std::vector<std::string> stringList {"one", "two", "three"}; 
- 
- for (auto& singleString : stringList) 
- { 
-  std:cout << singleString << std::endl; 
- } 
-`
\ No newline at end of file
+```cpp
+std::vector<std::string> stringList {"one", "two", "three"};
+
+for (auto& singleString : stringList)
+{
+  std:cout << singleString << std::endl;
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/cplusplus/the-auto-feature/index.md b/guide/arabic/cplusplus/the-auto-feature/index.md
index c3e6cd2428..3828ec232e 100644
--- a/guide/arabic/cplusplus/the-auto-feature/index.md
+++ b/guide/arabic/cplusplus/the-auto-feature/index.md
@@ -8,26 +8,29 @@ localeTitle: الميزة التلقائية
 
 بدون `auto` :
 
- `double x = 10.425; 
- double y = x * x; 
-` 
+```cpp
+double x = 10.425;
+double y = x * x;
+``` 
 
 مع `auto` :
 
- `double x = 10.425; 
- auto y = x * x; 
-` 
+```cpp
+double x = 10.425;
+auto y = x * x;
+``` 
 
 في حين أنه قد يبدو تافهاً ، فإنه يصبح مفيداً بشكل لا يصدق عندما تبدأ أنواع البيانات في التعقيد. على سبيل المثال ، افترض أنك تريد تخزين [`vector`](https://guide.freecodecamp.org/cplusplus/vector) من الموظفين ، وأنك مهتم فقط باسمهم وعمرهم. إحدى الطرق لتخزين الاسم والعمر يمكن أن تكون `pair` `string` وأخرى `unsigned int` . يتم `std::vector<std::pair<std::string, unsigned int>> employees` كـ `std::vector<std::pair<std::string, unsigned int>> employees` . الآن لنفترض أنك تريد الوصول إلى آخر موظف تمت إضافته:
 
- `std::vector<std::pair<std::string, unsigned int>> employees; 
- 
- // without auto, you have to write: 
- std::pair<std::string, unsigned int>> last_employee = employees.back(); 
- 
- // with auto, you just have to write: 
- auto last_employee = employees.back(); 
-` 
+```cpp
+std::vector<std::pair<std::string, unsigned int>> employees;
+
+// without auto, you have to write:
+std::pair<std::string, unsigned int>> last_employee = employees.back();
+
+// with auto, you just have to write:
+auto last_employee = employees.back();
+``` 
 
 بمجرد تحديد المحول البرمجي للنوع على الجانب الأيمن من `=` يستبدل `auto` بهذا النوع.
 
diff --git a/guide/arabic/cplusplus/tokens-variables/static-variable-info/index.md b/guide/arabic/cplusplus/tokens-variables/static-variable-info/index.md
index 3ad544de71..fb9c95757e 100644
--- a/guide/arabic/cplusplus/tokens-variables/static-variable-info/index.md
+++ b/guide/arabic/cplusplus/tokens-variables/static-variable-info/index.md
@@ -4,16 +4,17 @@ localeTitle: المتغيرات
 ---
 دعونا نناقش شيء يعرف كمتغيرات. المتغيرات هي بمثابة دلو. يمكنك وضع شيء فيه ثم تغييره بعد ذلك عند الحاجة. في C ++ ، هناك العديد من أنواع المتغيرات مثل الأعداد الصحيحة ، السلاسل ، Booleans وغيرها الكثير. دعونا ننظر إلى برنامج بسيط باستخدام المتغيرات الصحيحة. تخزن أعداد صحيحة الأعداد الصحيحة التي تكون موجبة أو سالبة أو صفر. الأرقام الكاملة ليست أرقام كسور على سبيل المثال 1/2 و 1/4 و 1/5. دعونا ننظر إلى برنامج بسيط يستخدم عددًا صحيحًا متغير.
 
- `#include <iostream> 
- using namespace std ; 
- int main() 
- { 
-    int a;          // Declare an integer variable a 
-    a = 5;          // Assign value of 5 to variable a 
-    cout << a;      // Display the value of variable a which contains 5 
-    return 0; 
- } 
-` 
+```cpp
+#include <iostream>
+using namespace std ;
+int main()
+{
+    int a;          // Declare an integer variable a
+    a = 5;          // Assign value of 5 to variable a
+    cout << a;      // Display the value of variable a which contains 5
+    return 0;
+}
+``` 
 
 عند تنفيذ هذا البرنامج ، سترى 5 معروضة على الشاشة
 
diff --git a/guide/arabic/cplusplus/vector/index.md b/guide/arabic/cplusplus/vector/index.md
index 2445bffe28..2c192a54f4 100644
--- a/guide/arabic/cplusplus/vector/index.md
+++ b/guide/arabic/cplusplus/vector/index.md
@@ -22,86 +22,94 @@ _ملاحظة_ : يجب عليك تضمين مكتبة المتجه عند اس
 
 استخدام قائمة intializer - حيث يتم إدراج الكائنات داخل مجموعة من الأقواس: `{ }`
 
- `std::vector<int> a{1, 2, 3, 4, 5}; // a is a vector of 5 ints: 1, 2, 3, 4 and 5 
- std::vector<std::string> b{"hello", "world"}; // b is a vector of 2 strings: "hello" and "world" 
- std::vector<bool> v; // v is an empty vector 
-` 
+```cpp
+std::vector<int> a{1, 2, 3, 4, 5}; // a is a vector of 5 ints: 1, 2, 3, 4 and 5
+std::vector<std::string> b{"hello", "world"}; // b is a vector of 2 strings: "hello" and "world"
+std::vector<bool> v; // v is an empty vector
+``` 
 
 بناءه من متجه آخر (يعرف هذا باسم نسخة البناء)
 
- `std::vector<double> a{1.0, 2.0, 3.0}; 
- std::vector<double> b(a); // b is a vector of 3 doubles: 1.0, 2.0 and 3.0 
-` 
+```cpp
+std::vector<double> a{1.0, 2.0, 3.0};
+std::vector<double> b(a); // b is a vector of 3 doubles: 1.0, 2.0 and 3.0
+``` 
 
 استهلاله بنفس العنصر:
 
- `std::vector<int> a(100, -1); // a is a vector of 100 elements all set to -1 
-` 
+```cpp
+std::vector<int> a(100, -1); // a is a vector of 100 elements all set to -1
+``` 
 
 ### المتجهات المتجهات
 
 يمكن اعتبار المتكررات كمؤشرات تستخدم على وجه التحديد للتنقل في الحاويات (مثل المتجهات). تبدأ أهم التكرارات `begin()` `end()` . `begin()` بإرجاع مؤشر إلى العنصر الأول في متجه بينما تشير نقاط `end()` إلى موضع واحد بعد العنصر الأخير في متجه. على هذا النحو من خلال حلقات ناقلات يمكن أن يتم على النحو التالي:
 
- `std::vector<int> vec{1, 2, 3}; 
- 
- for(auto vec_it = vec.begin(); vec_it != vec.end(); it++){ 
-    // since vec_it is a pointer and points to the memory address of the item 
-    // inside the vector, vec_it must be dereferenced using '*' 
-    std::cout << *it << '\n'; 
- } 
- /*  Output 
-    1 
-    2 
-    3 
- */ 
-` 
+```cpp
+std::vector<int> vec{1, 2, 3};
+
+for(auto vec_it = vec.begin(); vec_it != vec.end(); it++){
+    // since vec_it is a pointer and points to the memory address of the item
+    // inside the vector, vec_it must be dereferenced using '*'
+    std::cout << *it << '\n';
+}
+/*  Output
+    1
+    2
+    3
+*/
+``` 
 
 ### تعديل ناقل
 
 دفع العناصر إلى متجه:
 
- `std::vector<int> vec; // constructs an empty vector 
- 
- for (int i = 0; i < 10; i = i + 2){ 
-    vec.push_back(i); 
- } 
- // vec now holds [0, 2, 4, 6, 8] 
-` 
+```cpp
+std::vector<int> vec; // constructs an empty vector
+
+for (int i = 0; i < 10; i = i + 2){
+    vec.push_back(i);
+}
+// vec now holds [0, 2, 4, 6, 8]
+``` 
 
 يختلف إدراج عنصر في موضع معين قليلاً. إدراج ناقلات C ++ تعمل وظيفة على المكرر. وسوف تدرج البند المعطى موضع واحد قبل المعطى مكرر.
 
- `std::vector<unsigned int> vec{3, 400, 12, 45}; 
- 
- auto iter = vec.begin() + 2; // iter now points to '12' 
- vec.insert(iter, 38); // inserts '38' before '12' 
- 
- // vec: [3, 400, 38, 12, 45] 
-` 
+```cpp
+std::vector<unsigned int> vec{3, 400, 12, 45};
+
+auto iter = vec.begin() + 2; // iter now points to '12'
+vec.insert(iter, 38); // inserts '38' before '12'
+
+// vec: [3, 400, 38, 12, 45]
+``` 
 
 ### الوصول للعنصر
 
 توفر المكتبة القياسية وظائف مختلفة للوصول إلى عناصر معينة في متجهك.
 
- `std::vector<std::string> a{"test", "element", "access"}; 
- 
- std::string first_item = a.front(); // gets the first item of the vector ("test") 
- std::string last_item = a.back(); // gets the last item in the vector ("access") 
- 
- // To get an element at a specific index (remember: vector indices start at 0) 
- std::string second_item = a.at(2); // gets "element" 
- // OR 
- std::string second_item = a[2]; // gets "element" 
-` 
+```cpp
+std::vector<std::string> a{"test", "element", "access"};
+
+std::string first_item = a.front(); // gets the first item of the vector ("test")
+std::string last_item = a.back(); // gets the last item in the vector ("access")
+
+// To get an element at a specific index (remember: vector indices start at 0)
+std::string second_item = a.at(2); // gets "element"
+// OR
+std::string second_item = a[2]; // gets "element"
+``` 
 
 ### الالتفاف على العناصر في `vector`
 
 التكرار فوق العناصر الموجودة في المتحد C ++ `std::vector` يختلف اختلافًا كبيرًا عن التكرار فوق العناصر في متجه في JavaScript أو Ruby. نظرًا لأن C ++ عبارة عن تجريد رقيق لـ C ، فيمكنك فقط التكرار فوق العناصر باستخدام هذه المتغيرات الصغيرة الرائعة التي تسمى المتكررات للوصول إلى كل عنصر. غالبًا ما تأتي المتكررات في شكل مؤشرات هي متغيرات تقوم بتخزين عنوان الذاكرة لمتغير آخر. يمكنك معرفة المزيد حول المؤشرات [هنا](https://www.tutorialspoint.com/cplusplus/cpp_pointers.htm) . ومع ذلك ، لأن التكرارات تعمل كمؤشرات (أو العكس) ، من أجل معرفة ما يشيرون إليه ، تحتاج إلى إدخاله في متغير من نوع appropirate. كيف نفعل ذلك؟ هنا. نحن. اذهب!
 
- `std::vector<std::string> a{"test", "element", "access"}; 
- for(auto it = v.begin(); it != v.end(); it++) { //notice use of auto keyword 
-    cout<<*it<<endl; //Will print out string that the iterator is currently ppointing to 
- } 
-` 
+```cpp
+std::vector<std::string> a{"test", "element", "access"};
+for(auto it = v.begin(); it != v.end(); it++) { //notice use of auto keyword
+    cout<<*it<<endl; //Will print out string that the iterator is currently ppointing to
+}
+``` 
 
 من هنا ، يمكنك القيام بكل أنواع الأشياء الرائعة ، مثل التلاعب بالمتجه أو العبث مع أمره كما تشاء!
 
@@ -109,15 +117,16 @@ _ملاحظة_ : يجب عليك تضمين مكتبة المتجه عند اس
 
 توفر أيضًا مكتبة القوالب القياسية (STL) _طرقًا_ مختلفة لك:
 
- `std::vector.size(); // returns the size of the vector (the number of positions in the vector) 
- std::vector.begin(); // returns an iterator which is a pointer to the beginning of the vector 
- std::vector.end(); // returns an iterator which is a pointer to the end of the vector 
- std::vector.empty(); // returns true if the vector is empty, otherwise returns false. 
- std::vector.front(); // returns the first element of the vector. 
- std::vector.back(); // returns the last element of the vector. 
- std::vector.push_back(n); // inserts the element "n" to the end of the vector. 
- std::vector.pop_back(n); // removes the last element of the vector 
-` 
+```cpp
+std::vector.size(); // returns the size of the vector (the number of positions in the vector)
+std::vector.begin(); // returns an iterator which is a pointer to the beginning of the vector
+std::vector.end(); // returns an iterator which is a pointer to the end of the vector
+std::vector.empty(); // returns true if the vector is empty, otherwise returns false.
+std::vector.front(); // returns the first element of the vector.
+std::vector.back(); // returns the last element of the vector.
+std::vector.push_back(n); // inserts the element "n" to the end of the vector.
+std::vector.pop_back(n); // removes the last element of the vector
+``` 
 
 ### المتجهات المحاكية
 
@@ -125,17 +134,19 @@ _ملاحظة_ : يجب عليك تضمين مكتبة المتجه عند اس
 
 إعلان Iterator.
 
- `std::vector<int> v; 
- //Iterator delcaration for the above vector will correspond to 
- std::vector<int>::iterator it; 
-` 
+```cpp
+std::vector<int> v;
+//Iterator delcaration for the above vector will correspond to
+std::vector<int>::iterator it;
+``` 
 
 استخدام المكرر لطباعة عناصر المتجه باستخدام الحلقة
 
- `for(it=v.begin(); it!=v.end(); ++it) 
- //std::vector::begin and std::vector::end return iterator pointing to first and last element of the vector respectively. 
-  cout<<*it; 
-` 
+```cpp
+for(it=v.begin(); it!=v.end(); ++it)
+//std::vector::begin and std::vector::end return iterator pointing to first and last element of the vector respectively.
+  cout<<*it;
+``` 
 
 ### متكررة من خلال ناقل
 
@@ -155,9 +166,10 @@ _ملاحظة_ : يجب عليك تضمين مكتبة المتجه عند اس
 
 // باستخدام المؤشرات ل(الأمراض المنقولة جنسيا :: ناقلات :: size\_type i = 0؛ i! = myVector.size ()؛ ط ++) { std :: cout << "العنصر هو" << myVector \[i\] << std :: endl؛ // Dereference the iterator to access data }
 
- `### Sorting A Vector In Ascending Order 
- Sorting a vector based on ascending order can be done with the help of Sort() in C++. 
-` 
+```
+### Sorting A Vector In Ascending Order
+Sorting a vector based on ascending order can be done with the help of Sort() in C++.
+``` 
 
 حزب الشعب الكمبودي
 
@@ -177,9 +189,10 @@ cout << "Vector Contents Sorted In Ascending Order: \\ n"؛ for (int e: v) { cou
 
 العودة 0 }
 
- `### Sorting Vector In Descending Order 
- Sorting Vector in descending order can be done with the help of third argument namely greater<int>() in Sort() in C++. 
-` 
+```
+### Sorting Vector In Descending Order
+Sorting Vector in descending order can be done with the help of third argument namely greater<int>() in Sort() in C++.
+``` 
 
 حزب الشعب الكمبودي
 
diff --git a/guide/arabic/csharp/async-await/index.md b/guide/arabic/csharp/async-await/index.md
index ca3dedf5d1..0ee5a868da 100644
--- a/guide/arabic/csharp/async-await/index.md
+++ b/guide/arabic/csharp/async-await/index.md
@@ -16,45 +16,47 @@ localeTitle: غير متزامن / في انتظار
 
 1.  تقديم نموذج للخادم
 
- `private readonly string url = 'http://localhost:3000/api/submit'; 
- private readonly HttpContent formContent = new HttypContent(); 
- 
- // Update the formContent object while filling up the form. 
- 
- SubmitButton.Clicked += async (object, event) => 
- { 
-  // When PostAsync is hit, the button control will release the UI, while the 
-  //   http post method is still waiting on server response. 
-  HttpClient httpClient = new HttpClient(); 
-  var response = await httpClient.PostAsync(url, formContent); 
-  Console.WriteLine(response.StatusCode); 
- } 
-` 
+```csharp
+private readonly string url = 'http://localhost:3000/api/submit';
+private readonly HttpContent formContent = new HttypContent();
+
+// Update the formContent object while filling up the form.
+
+SubmitButton.Clicked += async (object, event) =>
+{
+  // When PostAsync is hit, the button control will release the UI, while the
+  //   http post method is still waiting on server response.
+  HttpClient httpClient = new HttpClient();
+  var response = await httpClient.PostAsync(url, formContent);
+  Console.WriteLine(response.StatusCode);
+}
+``` 
 
 2.  المزالج "المزالج"
 
- `public async Task<int> CalcDamage(Player player) 
- { 
-  // CPU-intense method, calculate afflicted damage done to the 
-  //   Boss based on the damage types, Boss stats (from static data), 
-  //   player stats, etc. 
-  // ... 
- } 
- 
- public static async Task<int> CalcTotalDamage(IEnumerable<Player> group) 
- { 
-  var totalDamage = 0; 
-  foreach (Player player in group) 
-  { 
-    // each of the async methods are queued in the thread-pool and move on. 
-    totalDamage += CalcDamage(player); 
-  } 
- 
-  // total damage done must be calculated from all players in the group 
-  //   before we return the result. 
-  return await Task.WhenAll(totalDamage); 
- } 
-` 
+```csharp
+public async Task<int> CalcDamage(Player player)
+{
+  // CPU-intense method, calculate afflicted damage done to the
+  //   Boss based on the damage types, Boss stats (from static data),
+  //   player stats, etc.
+  // ...
+}
+
+public static async Task<int> CalcTotalDamage(IEnumerable<Player> group)
+{
+  var totalDamage = 0;
+  foreach (Player player in group)
+  {
+    // each of the async methods are queued in the thread-pool and move on.
+    totalDamage += CalcDamage(player);
+  }
+
+  // total damage done must be calculated from all players in the group
+  //   before we return the result.
+  return await Task.WhenAll(totalDamage);
+}
+``` 
 
 ## الغش ورقة
 
diff --git a/guide/arabic/csharp/break/index.md b/guide/arabic/csharp/break/index.md
index 9c1bd97378..fa73b8c734 100644
--- a/guide/arabic/csharp/break/index.md
+++ b/guide/arabic/csharp/break/index.md
@@ -23,10 +23,11 @@ localeTitle: بيان استراحة
 
 ## انتاج:
 
- `> Item on index 0 is 1 
- > Item on index 1 is 2 
- > Item on index 2 is 3 
-` 
+```
+> Item on index 0 is 1
+> Item on index 1 is 2
+> Item on index 2 is 3
+``` 
 
 في المثال الثاني ، يتم تضمين بيان فاصل في نهاية كل حالة. هذا ينفذ البيانات في القضية دون الاستمرار في القضية القادمة. بدون بيان الاستراحة ، سيستمر البرنامج في تنفيذ الحالة التالية ولن يعمل على النحو المنشود.
 
@@ -53,14 +54,15 @@ localeTitle: بيان استراحة
 
 ## انتاج:
 
- `> case 1 
- > This only shows in example 1 
- > 
- > case  2 
- > This only shows in example 2 
- > This also only shows in example 2 
- > 
- > default 
- > This only shows in the Default Example 
- > 
-`
\ No newline at end of file
+```
+> case 1
+> This only shows in example 1
+>
+> case  2
+> This only shows in example 2
+> This also only shows in example 2
+>
+> default
+> This only shows in the Default Example
+>
+```
\ No newline at end of file
diff --git a/guide/arabic/csharp/class/index.md b/guide/arabic/csharp/class/index.md
index e40620d73e..3967c26027 100644
--- a/guide/arabic/csharp/class/index.md
+++ b/guide/arabic/csharp/class/index.md
@@ -6,12 +6,13 @@ localeTitle: صف دراسي
 
 يتم تعريف الفئة في C # كنوع مرجع. لكي تقوم بتأسيس متغير بنوع مرجعي ، يجب عليك تحديد الكلمة الرئيسية `new` ، وإلا سيكون للمتغير القيمة الافتراضية للقيمة `null` . إنظر في الأسفل للمثال.
 
- `// The value of variableOne is null at this point. 
- NewClass variableOne; 
- 
- // Now the value of variableOne will be an instance of the class NewClass 
- variableOne = new NewClass(); 
-` 
+```csharp
+// The value of variableOne is null at this point.
+NewClass variableOne;
+
+// Now the value of variableOne will be an instance of the class NewClass
+variableOne = new NewClass();
+``` 
 
 في وقت التشغيل عندما يتم إنشاء الفئة يتم تخصيص ذاكرة كافية على كومة الذاكرة المؤقتة لمثيل محدد من الفئة التي يحتفظ بها المتغير.
 
@@ -21,49 +22,51 @@ localeTitle: صف دراسي
 
 مثل اللغات الأخرى ، يقوم C # بإنشاء مُنشئ افتراضي لا يقبل أي معلمات. يمكننا أيضًا تحديد مُنشئنا الخاص بنا إذا احتجنا إلى استخدام معلمات خاصة أو الحصول على خطوات إنشاء مخصصة في مُنشئنا.
 
- `public class NewClass 
- { 
-    NewClass(string name) 
-    { 
-        // Initialization steps... 
-    } 
- } 
-` 
+```csharp
+public class NewClass
+{
+    NewClass(string name)
+    {
+        // Initialization steps...
+    }
+}
+``` 
 
 الصف هو نموذج أولي أو مخطط منه يتم إنشاء الكائنات منه. في C # ، يتم تعريف الفصل باستخدام فئة الكلمة الأساسية. يتم استخدام فئة الجمع بين بعض الأساليب والخصائص والمجالات والأحداث والمندوبين في وحدة واحدة. قد تحتوي الفئة على فئات متداخلة أيضًا.
 
 #### مثال: النظر في حالة فئة الموظف أدناه:
 
- `using System; 
- 
- namespace CPrograms 
- { 
-    class Employee 
-    { 
-        private string name; 
-        private int employeeId; 
- 
-        public Employee(string name, int employeeId) 
-        { 
-            this.name = name; 
-            this.employeeId = employeeId; 
-        } 
-        public void PrintEmployee() 
-        { 
-            Console.WriteLine("Employee Name: {0} , Employee ID: {1}", this.name, this.employeeId); 
-        } 
-    } 
- 
-    class Program 
-    { 
-        static void Main(string[] args) 
-        { 
-            Employee employeeObject = new Employee("John Doe", 420156); 
-            employeeObject.PrintEmployee(); 
-        } 
-    } 
- } 
-` 
+```csharp
+using System;
+
+namespace CPrograms
+{
+    class Employee
+    {
+        private string name;
+        private int employeeId;
+
+        public Employee(string name, int employeeId)
+        {
+            this.name = name;
+            this.employeeId = employeeId;
+        }
+        public void PrintEmployee()
+        {
+            Console.WriteLine("Employee Name: {0} , Employee ID: {1}", this.name, this.employeeId);
+        }
+    }
+
+    class Program
+    {
+        static void Main(string[] args)
+        {
+            Employee employeeObject = new Employee("John Doe", 420156);
+            employeeObject.PrintEmployee();
+        }
+    }
+}
+``` 
 
 يمكن للفئة أن ترث من فئة أساسية واحدة فقط. ومع ذلك ، يمكن أن تنفذ من أكثر من واجهة واحدة.
 
diff --git a/guide/arabic/csharp/continue/index.md b/guide/arabic/csharp/continue/index.md
index cccd405e21..9561a77d4d 100644
--- a/guide/arabic/csharp/continue/index.md
+++ b/guide/arabic/csharp/continue/index.md
@@ -23,8 +23,9 @@ localeTitle: متابعة البيان
 
 ## انتاج:
 
- `> Item on index 0 is 1 
- > Item on index 1 is 2 
- > Item on index 3 is 4 
- > Item on index 4 is 5 
-`
\ No newline at end of file
+```
+> Item on index 0 is 1
+> Item on index 1 is 2
+> Item on index 3 is 4
+> Item on index 4 is 5
+```
\ No newline at end of file
diff --git a/guide/arabic/csharp/do-while-loop/index.md b/guide/arabic/csharp/do-while-loop/index.md
index abe3bf8734..5faebf9c72 100644
--- a/guide/arabic/csharp/do-while-loop/index.md
+++ b/guide/arabic/csharp/do-while-loop/index.md
@@ -28,11 +28,12 @@ localeTitle: هل في حين حلقة
 
 ## انتاج:
 
- `> Type A to continue: b 
- > Type A to continue: g 
- > Type A to continue: A 
- > Bye! 
-` 
+```
+> Type A to continue: b
+> Type A to continue: g
+> Type A to continue: A
+> Bye!
+``` 
 
 #### معلومات اكثر:
 
diff --git a/guide/arabic/csharp/enumerations/index.md b/guide/arabic/csharp/enumerations/index.md
index 859a29fea8..25b2f316e8 100644
--- a/guide/arabic/csharp/enumerations/index.md
+++ b/guide/arabic/csharp/enumerations/index.md
@@ -8,12 +8,13 @@ localeTitle: التعدادات
 
 ## مثال
 
- `enum Gender 
- { 
-  Male, 
-  Female 
- } 
-` 
+```
+enum Gender
+{
+  Male,
+  Female
+}
+``` 
 
 بشكل افتراضي ، تبدأ قيم الأعداد الصحيحة عند 0 وتزيد بمقدار 1 ، لكل اسم تعداد أي ذكور = 0 ، أنثى = 1 إلخ.
 
@@ -21,12 +22,13 @@ localeTitle: التعدادات
 
 ## مثال
 
- `enum Gender 
- { 
-  Male = 1, 
-  Female 
- } 
-` 
+```
+enum Gender
+{
+  Male = 1,
+  Female
+}
+``` 
 
 في هذه الحالة ، ستبدأ قيم عدد صحيح في 1 وتزيد من هناك.
 
@@ -36,12 +38,14 @@ localeTitle: التعدادات
 
 يمكنك أيضًا إرسال قيمة اسم التعداد إلى القيمة الصحيحة الأساسية والعكس صحيح:
 
- `Console.WriteLine($"Male: {(int)Gender.Male}"); 
- Console.WriteLine($"Female: {(int)Gender.Female}"); 
-` 
+```
+Console.WriteLine($"Male: {(int)Gender.Male}");
+Console.WriteLine($"Female: {(int)Gender.Female}");
+``` 
 
 ## انتاج:
 
- `Male: 1 
- Female: 2 
-`
\ No newline at end of file
+```
+Male: 1
+Female: 2
+```
\ No newline at end of file
diff --git a/guide/arabic/csharp/exceptions/index.md b/guide/arabic/csharp/exceptions/index.md
index 77d0ddee89..863fffb891 100644
--- a/guide/arabic/csharp/exceptions/index.md
+++ b/guide/arabic/csharp/exceptions/index.md
@@ -10,10 +10,11 @@ localeTitle: استثناءات
 
 إذا حاولنا قراءة نص ملف غير موجود:
 
- `using System.IO; 
- 
- string content = File.ReadAllText(@"C:\DoesNotExist.txt"); 
-` 
+```
+using System.IO;
+
+string content = File.ReadAllText(@"C:\DoesNotExist.txt");
+``` 
 
 سيتم رفع `FileNotFoundException` .
 
@@ -46,20 +47,22 @@ localeTitle: استثناءات
 
 بدلا من
 
- `try 
- { 
-   conn.Close(); 
- } 
- catch (Exception ex) 
- { 
-   //code for handling exceptions. 
- } 
-` 
+```
+try
+{
+   conn.Close();
+}
+catch (Exception ex)
+{
+   //code for handling exceptions.
+}
+``` 
 
 جرب هذا
 
- `if (conn.State != ConnectionState.Closed) 
- { 
-    conn.Close(); 
- } 
-`
\ No newline at end of file
+```
+if (conn.State != ConnectionState.Closed)
+{
+    conn.Close();
+}
+```
\ No newline at end of file
diff --git a/guide/arabic/csharp/expression-bodied-members/index.md b/guide/arabic/csharp/expression-bodied-members/index.md
index b2f9c849d0..9ca5d525de 100644
--- a/guide/arabic/csharp/expression-bodied-members/index.md
+++ b/guide/arabic/csharp/expression-bodied-members/index.md
@@ -8,29 +8,33 @@ localeTitle: طرق وعبارات بوديشن التعبير
 
 في ما يلي مثال لإعلان أسلوب منتظم:
 
- `public Point CreatePoint(int x, int y) 
- { 
-    return new Point(x, y); 
- } 
-` 
+```csharp
+public Point CreatePoint(int x, int y)
+{
+    return new Point(x, y);
+}
+``` 
 
 ما يلي يعطي نفس النتيجة ، ولكن يتم كتابتها كطريقة تعبير جسدي:
 
- `public Point CreatePoint(int x, int y) => new Point(x, y); 
-` 
+```csharp
+public Point CreatePoint(int x, int y) => new Point(x, y);
+``` 
 
 يمكنك أيضًا الإعلان عن الخصائص باستخدام بناء الجملة هذا. التعليمة البرمجية التالية هي كيفية تعريف خاصية get-only بدون تعبير lambda:
 
- `public Point Location 
- { 
-    get 
-    { 
-        return _location; 
-    } 
- } 
-` 
+```csharp
+public Point Location
+{
+    get
+    {
+        return _location;
+    }
+}
+``` 
 
 من خلال طريقة التعبير الجسدي ، يمكننا تقليص هذا الرمز إلى سطر واحد فقط:
 
- `public Point Location => _location 
-`
\ No newline at end of file
+```csharp
+public Point Location => _location
+```
\ No newline at end of file
diff --git a/guide/arabic/csharp/extension-methods/index.md b/guide/arabic/csharp/extension-methods/index.md
index 0b05b8110c..5eaa109218 100644
--- a/guide/arabic/csharp/extension-methods/index.md
+++ b/guide/arabic/csharp/extension-methods/index.md
@@ -31,8 +31,9 @@ localeTitle: ملحق ميهود
 
 يمكنك الآن إحضار أسلوب **WordCount** إلى النطاق **باستخدام** التوجيه:
 
- `using ExtensionMethods; 
-` 
+```
+using ExtensionMethods;
+``` 
 
 ويمكنك الاتصال به من تطبيق باستخدام بناء الجملة هذا:
 
diff --git a/guide/arabic/csharp/for/index.md b/guide/arabic/csharp/for/index.md
index e3f3f7f373..cac8071144 100644
--- a/guide/arabic/csharp/for/index.md
+++ b/guide/arabic/csharp/for/index.md
@@ -33,12 +33,13 @@ localeTitle: لحلقة
 
 ## انتاج:
 
- `> Item on index 0 is 1 
- > Item on index 1 is 2 
- > Item on index 2 is 3 
- > Item on index 3 is 4 
- > Item on index 4 is 5 
-` 
+```
+> Item on index 0 is 1
+> Item on index 1 is 2
+> Item on index 2 is 3
+> Item on index 3 is 4
+> Item on index 4 is 5
+``` 
 
 ### مصادر