اذهب إلى المحتوى
  • 0

وظيفة وفائدة عنصر code في HTML

Amro Atef Awad

السؤال

Recommended Posts

  • 0

عنصر <code> في HTML يُستخدم لتحديد قسم من النص كشيفرة برمجية أو شيفرة مرجعية.

وفيما يلي بعض النقاط المهمة حول عنصر <code>:

  1. يعتبر عنصرًا فارغًا، ويجب استخدامه مع بداية ونهاية تاجات الافتتاح والإغلاق <code></code>.
  2. يجب استخدام عنصر <code> فقط لعرض النصوص البرمجية أو الشيفرات المرجعية، وأيضًا لعرض تعليمات المستخدم أو الأكواد القابلة للنسخ.
  3. لا يقوم عنصر <code> بتنفيذ أي تنسيق خاص على النص.
  4. يتم عادة استخدام CSS لتخصيص تنسيق الشيفرة البرمجية داخل عنصر <code>،مثلاً، تعيين أنواع الخط والألوان والتظليل لتحسين قراءة الشيفرة.

وهو يستخدم على نطاق واسع في صفحات الويب لعرض الشيفرة المصدرية أو البرمجية بشكل منسق وواضح، وبإمكانك استخدامه أيضًا في الوثائق التقنية والمدونات التي تتضمن شروحات برمجية لتوضيح الأكواد والأمثلة.

مثال:

<html>
  <head> </head>
  <body>
    <pre>
      <code>
        // يبدأ الكود من هنا
        #include< iostream>
        
        #include< stack>
        using namespace std;

        int main() {
          stack<int> stack1;

          stack1.push(0);
          stack1.push(2);
          stack1.push(5);
          stack1.push(3);
          stack1.push(1);
        
        } // ينتهي الكود هنا
      </code>
    </pre>
  </body>
</html>

ولاحظ أنني قمت باستخدام عنصر pre للإحتفاظ بتنسيق النص كما قمت بكتابته وبدون الحاجة إلى كتابة أكواد CSS، وإليك النتيجة:

2023-06-02_02-47-57.thumb.png.64a5eeb8622a8577e25753835fe24c07.png

وقد يبدوا الأمر محير بعض الشيء لك فما الفائدة إذا كان عنصر فقط ولا يقوم بأي تسنيق؟

ولكن يُعتبر عنصر <code> جزءًا من HTML الدلالي (Semantic HTML)، وهو مفهوم يهدف إلى استخدام العناصر والوسوم في HTML بطريقة توفر معنى وهيكلية أكثر دقة للمستند.

وتستطيع تنسيق الكود من خلال استهداف العنصر.

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

يمكن استخدام العنصر "code" في HTML لعدة أغراض، منها:

  • عرض شفرة البرمجة: يمكن استخدام العنصر "code" لعرض الشفرة البرمجية وتسهيل قراءتها وفهمها. على سبيل المثال:
<code>
function sum(a, b) {
  return a + b;
}
</code>
  • عرض رسائل الخطأ: يمكن استخدام العنصر "code" لعرض رسائل الخطأ والتحذيرات التي تظهر في صفحة الويب، مثل رسائل الخطأ التي تظهر في وحدة تحكم المطور. على سبيل المثال:
<code>

Uncaught TypeError: Cannot read property 'length' of null

</code>

عرض محتوى البريد الإلكتروني: يمكن استخدام العنصر "code" لعرض محتوى البريد الإلكتروني المتعلق بالشفرة البرمجية، مثل رسائل الخطأ التي تظهر في البريد الإلكتروني. على سبيل المثال:

<code>
Subject: Error message

An error has occurred while processing your request. Please try again later.
</code>

يمكن استخدام العنصر "code" في HTML في العديد من السياقات المختلفة، وذلك لتحسين عرض وفهم الشفرة البرمجية وتسهيل عملية التطوير.

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...