HTML Quotations | In Arabic

---

HTML Quotations – فى هذا الفصل هنتعرف على كيفية تضمين النصوص المٌقتبسة فى صفحات الويب بإستخدام عناصر الاقتباس في HTML.

---

 

HTML Quotations

 

تُستخدم عناصر الاقتباس في HTML لإدراج نصوص مقتبسة في صفحة ويب ، أي جزء من النصوص يختلف عن النصوص العادية في صفحة الويب.

 

عناصر الاقتباس في HTML

 

العناصر التى تُستخدم فى تضمين الاقتباسات:

1. <blockquote>
2. <q>
3. <cite>
4. <abbr>
5. <address>
6. <bdo>

 

1. <blockquote>

 

يحدد العنصر <blockquote> نص مٌقتبس من مصدر آخر. يمكنك بسهولة تنسيق الاقتباس باستخدامه.

عادةً ما تقوم المتصفحات بوضع مسافة بادئة لعناصر <blockquote>، كالتالى:

<p>Read this quotation:</p>
<blockquote>
   Programming today is a race between software engineers striving to build bigger and better idiot-proof programs, 
   and the Universe trying to produce bigger and better idiots. So far, the Universe is winning.
</blockquote>

---

 

2. <q>

 

يحدد العنصر <q> اقتباسًا قصيرًا (ويسمى short inline quotations).

تقوم المستعرضات عادةً بإدراج علامات الاقتباس/التنصيص حول الاقتباس. كالتالى:

<p>This is a <q>short inline</q> quotation Example!</p>
<p><q>First, solve the problem. Then, write the code.</q> -John Johnson</p>

---

---

 

3. <cite>

 

يشير العنصر <cite> إلى اقتباس أو عنوان عمل، على سبيل المثال: كتاب أو مقال أو قصيدة أو فيلم، ..إلخ.

عادةً ما يتم عرض النص الموجود في العنصر <cite> بخط مائل (يمكنك تجاوز هذا النمط الإفتراضى باستخدام CSS). كالتالى:

<p><cite>Clean code</cite> the best book for every programmer!</p>

---

 

السمة cite

 

تحدد السمة cite عنوان URL يوفر سياقًا أو مرجعًا للشئ المقتبس. يمكنك إستخدام هذه السمة مع العنصرين <q> و <blockquote> أيضًا. كالتالى:

<p><q cite="https://dzone.com/articles/best-programming-jokes-amp-quotes">First, solve the problem. Then, write the code.</q> -John Johnson</p>

---

---

 

4. <abbr>

 

يحدد العنصر <abbr> (إختصار لـ abbreviation) شكلًا مختصرًا لكلمة أو عبارة طويلة، مثل “WWW” و “CSS” و “HTML” و “SSL“، ..إلخ. كالتالى:

<p>The <abbr title="World Wide Web">WWW</abbr> commonly known as the Web, 
is an information system where documents and other web resources are identified by Uniform Resource Locators.</p>

---

 

5. <address>

 

يحدد العنصر <address> معلومات الاتصال لمؤلف، او لمالك موقع الويب.

يتم إستخدام هذا العنصر لتعريف تفاصيل الاتصال لمؤلف أو مالك المستند، يمكن تكون هذه المعلومات عبارة عن (عنوان بريد إلكترونى – عنوان فعلي (إسم البلد / رقم الشارع والمنزل …إلخ) – عنوان URL – رقم الهاتف، …إلخ). بحيث يمكن للقارئ استخدام هذه التفاصيل للاتصال بمالك المستند، وتعرض معظم المتصفحات العنوان بخط مائل. كالتالى:

<address>
  Email: example@example.com<br>
  Address: Egypt, street number<br>
  Written by: Hamed Essam!
</address>

---

 

6. <bdo> 

 

يُستخدم الوسم <bdo> (اختصار لـ Bi-Directional Override ) لتجاوز اتجاه النص الحالي.

يتجاوز عنصر <bdo> الاتجاه الحالي للنص ، بحيث يتم تقديم النص داخل اتجاه مختلف. كالتالى:

<p>This text will start from left to right.</p>
<p><bdo dir="rtl">This text will start from right to left.</bdo></p>
<p>سيبدأ هذا النص من اليمين إلى اليسار.</p>
<p><bdo dir="ltr">سيبدأ هذا النص من اليسار إلى اليمين.</bdo></p>

---