<blockquote>
وسم الاقتباس <blockquote>
وسم blockquote يميز نصًّا منقولًا من مصدر آخر ككتلة اقتباس مستقلة — مع cite لرابط المصدر.
إعلان صريح للقارئ والآلات معًا: «هذا الكلام ليس لي». المتصفح يزيحه افتراضيًّا عن النص، والعرف التصميمي الراسخ يضيف خطًّا جانبيًّا (يمين الصفحة في RTL) وخلفية هادئة.
للمصدر مساران: خاصية cite برابط المصدر (غير مرئية، للآلات)، وسطر نسبة مرئي أسفل الاقتباس. وللاقتباس القصير داخل الجملة يوجد وسم q الذي يضيف علامات التنصيص تلقائيًّا.
الصياغة
<blockquote cite="https://source.com"> <p>النص المقتبس.</p> </blockquote>
⚡ جرّب بنفسك
عدّل الكود واضغط «تحديث» لترى النتيجة فورًا — التجربة أفضل معلّم.
🎨 محرّر HTML/CSS
<blockquote style="border-right:4px solid #7c5cff; background:#ede9fe; margin:0; padding:12px 16px; border-radius:8px"> <p style="margin:0">التعلم بالتجربة أبقى أثرًا من التعلم بالمشاهدة.</p> </blockquote> <p style="font-size:14px; color:#666">— حكمة برمجية</p>
النتيجة المباشرة:
أهم الخصائص
| الخاصية | الوظيفة |
|---|---|
| cite | رابط مصدر الاقتباس — للآلات، لا يظهر للزائر |
💡 نصائح عملية
- في RTL اجعل خط التمييز يمينًا: border-right لا border-left
- اقتباس قصير وسط جملة؟ وسم q يتكفل بعلامات التنصيص
⚠️ أخطاء شائعة
- استخدامه للإزاحة الجمالية لنص ليس اقتباسًا — الإزاحة وظيفة margin
- نسيان نسبة المصدر فيُحسب الكلام عليك
وسوم ذات صلة
🎓 تريد فهم الصورة الكاملة خطوة بخطوة؟ ابدأ من مسار HTML الكامل بالعربي.
📚 للتعمق التقني الكامل بالإنجليزية: MDN Web Docs