اقتباس HTML وعناصر الاقتباس

سنتناول في هذا الفصل عناصر <blockquote> و <q> و <abbr> و <address> و <cite> و <bdo>.

هنا اقتباس من موقع WWF:

منذ ما يقرب من 60 عامًا ، دأب الصندوق العالمي للطبيعة على حماية مستقبل الطبيعة. منظمة الحفظ العالمية الرائدة في العالم ، تعمل WWF في 100 دولة ويدعمها أكثر من مليون عضو في الولايات المتحدة وما يقرب من خمسة ملايين على مستوى العالم.

<blockquote> للاقتباسات
يحدد عنصر <blockquote> قسمًا مقتبسًا من مصدر آخر.
عادة ما تقوم المتصفحات بوضع مسافة بادئة لعناصر <blockquote>.
مثال

<!DOCTYPE html>
<html>
<body>
 <p> هنا اقتباس من موقع WWF: </p>
 <blockquote cite="http://www.worldwildlife.org/who/index.html">
على مدار 50 عامًا ، ظل الصندوق العالمي للطبيعة يحمي مستقبل الطبيعة.
منظمة الحفظ الرائدة في العالم ،
تعمل WWF في 100 دولة وتدعمها
1.2 مليون عضو في الولايات المتحدة و
ما يقرب من 5 ملايين على مستوى العالم.
 </blockquote>
</body>
</html>

<q> للاقتباسات القصيرة

تحدد علامة <q> اقتباسًا قصيرًا.

تقوم المستعرضات عادةً بإدراج علامات الاقتباس حول الاقتباس.

مثال

<!DOCTYPE html>
<html>
<body>
 <p> هدف الصندوق العالمي للطبيعة هو: <q> بناء مستقبل يعيش فيه الناس في وئام مع الطبيعة. </q>      </p>
</body>
</html>

<abbr> للاختصارات

تحدد علامة <abbr> اختصارًا أو اختصارًا ، مثل "HTML" و "CSS" و "Mr." و "Dr." و "ASAP" و "ATM".

يمكن أن توفر علامات الاختصارات معلومات مفيدة للمتصفحات وأنظمة الترجمة ومحركات البحث.

نصيحة: استخدم سمة العنوان العام لإظهار وصف الاختصار / الاختصار عند تحريك الماوس فوق العنصر.

مثال

<!DOCTYPE html>
<html>
<body>
 <p> تأسست <abbr title="World Health Organization"> WHO </abbr> في عام 1948.    </p>
</body>
</html>

<address> لمعلومات الاتصال

تحدد علامة <address> معلومات الاتصال لمؤلف / مالك مستند أو مقالة.

يمكن أن تكون معلومات الاتصال عبارة عن عنوان بريد إلكتروني ، وعنوان URL ، وعنوان فعلي ، ورقم هاتف ، ومعالج وسائط اجتماعية ، وما إلى ذلك.

عادةً ما يتم عرض النص الموجود في عنصر <address> بخط مائل ، وستضيف المتصفحات دائمًا فاصل أسطر قبل وبعد عنصر <address>.

مثال

<!DOCTYPE html>
<html>
<body>
 <address>
بقلم عمر حسن. <br>
قم بزيارتنا على: <br>
example.com <br>
564 القاهرة  <br>
الجمهورية المصرية
</address>
</body>
</html>

<cite> لعنوان العمل

تحدد علامة <cite> عنوان العمل الإبداعي (على سبيل المثال ، كتاب ، قصيدة ، فيلم ، لوحة ، تمثال ، إلخ).

ملاحظة: اسم الشخص ليس عنوان العمل.

عادةً ما يتم عرض النص الموجود في عنصر <cite> بخط مائل.

مثال

<!DOCTYPE html>
<html>
<body>
   <p> <cite>الصرخة</cite> بواسطة إدوارد مونش. رسمت عام 1893. </p>
</body>
</html>

<bdo> للتجاوز ثنائي الاتجاه

BDO تعني تجاوز ثنائي الاتجاه.

تُستخدم علامة <bdo> لتجاوز اتجاه النص الحالي:

مثال

<!DOCTYPE html>
<html>
<body>
<p> إذا كان متصفحك يدعم التجاوز ثنائي الاتجاه (bdo) ، فسيتم كتابة السطر التالي من اليمين إلى اليسار (rtl): </p>
<bdo dir="rtl"> سيُكتب هذا السطر من اليمين إلى اليسار </bdo>
</body>
</html>

الدرس السابق الدرس التالي