تعلم HTML الجزء 12: استخدام عناصر Kbd و Samp و Code و Var في HTML

في هذه المناقشة ، ستكون المادةتمت مناقشته حول تنسيق التعليمات البرمجية (كتابة أشياء فنية) في HTML والذي يناقش على وجه التحديد أوامر الكتابة التي تم إدخالها من لوحة المفاتيح باستخدام علامة <kbd> ، وكتابة عينة من التعليمات البرمجية للبرنامج باستخدام علامة <samp> ، وكتابة التعليمات البرمجية إلى HTML باستخدام علامة <code> وكتابة نص الذي يحتوي على متغيرات برنامجية أو رياضية بعلامة <var>.

كل هذه العلامات تعمل بشكل أفضلبنية HTML مقارنة بالشاشة. عادة ، يتم استخدام هذه العلامات في كتابة كود البرنامج الموجود على محتوى الويب. لكي تفهم بشكل أفضل استخدام هذه العلامات ، دعنا نفكر في الشرح أدناه:

أ استخدام عنصر <kbd>

يشير عنصر kbd إلى لوحة المفاتيح. حيث يتم استخدام علامة <kbd> لتمثيل الإدخال من المستخدم (في شكل أحرف من لوحة المفاتيح أو من أجهزة أخرى مثل الأوامر الصوتية).

سيتم عرض النص أو المحتوى الموجود في علامة <kbd> بخط أحادي المسافة. في ما يلي مثال لرمز استخدام علامة <kbd> في HTML:

<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Elemen kbd di HTML</title>
</head>
<body>
<p>Untuk mematikan proses, tekan <kbd>CTRL+ALT+Delete</kbd></p>
</body>
</html>

بعد تشغيل الكود أعلاه في متصفح الويب ، سيظهر كما هو موضح أدناه:

ب. استخدام عنصر <samp>

عنصر samp هو اختصار لبرنامج العينةوالذي يتضمن نوع العناصر المضمنة ويتبع تدفق النص الحالي. تُستخدم هذه العلامة لكتابة مثال على الإخراج من برنامج كمبيوتر. سيتم عرض النص في علامة <samp> بواسطة متصفحات الويب باستخدام خطوط أحادية المسافة عن طريق إزالة أكثر من مسافة واحدة ومماثلة لعلامة <code>.

في ما يلي مثال لرمز استخدام علامة <samp> في HTML:

<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Elemen samp di HTML</title>
</head>
<body>
<p>Mengkonversi nilai ASCII ke dalam karakter dengan menggunakan metode <samp>string.fromCharCode()</samp>
</body>
</html>

بعد تشغيل الكود أعلاه في متصفح الويب ، سيظهر كما هو موضح أدناه:

ج. استخدام عنصر <code>

يتم استخدام علامة <code> لكتابة جزء التعليمات البرمجيةالكمبيوتر إلى HTML. حيث يتضمن رمز الكمبيوتر اسم عنصر XML أو برنامج الكمبيوتر أو اسم الملف أو الرموز الأخرى التي يتعرف عليها الكمبيوتر.

سيتم عرض النص في علامة <samp>بواسطة متصفحات الويب باستخدام خطوط أحادية المسافة من خلال إزالة أكثر من مسافة واحدة. يتم تضمين هذه العلامة أيضًا في نوع العنصر المضمن وتتبع تدفق النص الحالي. في علامة <samp> ، هناك سمة فئة يُقترح استخدامها للإشارة إلى لغة رمز الكمبيوتر المكتوب. على سبيل المثال ، يمكنك كتابة رمز CSS ، لذا اكتب "language-css" في سمة class مثل <code class = "language-css"> ... </code>.

في ما يلي مثال لرمز استخدام علامة <code> في HTML:

<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Elemen Code di HTML</title>
</head>
<body>
<p>CSS Default Setting : <code class="language-css">code{ font-family: monospace; }</code></p>
</body>
</html>

بعد تشغيل الكود أعلاه في متصفح الويب ، سيظهر كما هو موضح أدناه:

D. استخدام عنصر <var>

عنصر var يرمز إلى المتغير الذيتستخدم لتعريف وكتابة متغير برنامج أو صيغة رياضية. سيتم عرض النص الموجود في هذه العلامة بخط مائل (مائل).

في ما يلي مثال لرمز استخدام علامة <var> في HTML:

<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Elemen Var di HTML</title>
</head>
<body>
<p>Misalkan laba diinisialisasikan sebagai <var>x</var></p>
</body>
</html>

بعد تشغيل الكود أعلاه في متصفح الويب ، سيظهر كما هو موضح أدناه:

العلامات الأربع الموضحة أعلاه هي "تقريبًا"لديهم نفس الوظيفة ، ولكن بالطبع استخداماتهم تختلف عن بعضها البعض. تتناول المادة التالية لدراسة HTML كيفية إضافة التعليقات في HTML.

</p>

اقرأ المزيد: