HTML Computercode

يحتوي HTML على عدة عناصر لتحديد إدخالات المستخدم ورموز الكمبيوتر، سنتعرف عليها فى هذا الفصل.

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

بمساعدة هذه عناصر أو الوسوم، ستتمكن من كتابة الرموز لعرضها على صفحة الويب الخاصة بك.

مثال:

<code>
    name   = "Hamed";<br>
    age    = 30;<br>
    gender = "Male";
</code>

فيما يلي قائمة ببعض الوسوم المستخدمة في HTML لهذه المهمة:

<code>
<kbd>
<pre>
<samp>
<var>

HTML <code> element

يتم استخدام عنصر الـ code لتمثيل بعض رموز البرمجة على موقع الويب الخاص بك.

سيتم عرض المحتوى المكتوب بين العلامتين بخط افتراضي أحادي المسافة:

<code>
    name   = "Hamed";<br>
    age    = 30;<br>
    gender = "Male";
</code>

{Outputs} الكود السابق:


        name   = "Hamed";

        age    = 30;

        gender = "Male";

HTML <kbd> Element

يتم استخدام عنصر الـ kbd لتمثيل مدخلات المستخدم وإدخال لوحة المفاتيح والأمر الصوتي ، ..إلخ.

النص المكتوب ضمن علامتين <kbd> ….. </kbd> يتم عرضه عادةً بخط أحادي المسافة (الافتراضي للمتصفح):

<p>To copy your content press on <kbd>Ctrl + C</kbd></p>

{Outputs} الكود السابق:

To copy your content press on Ctrl + C

HTML <pre> element

يحدد العنصر pre النص المنسق مسبقًا ، والذي يعرض المحتوى داخله بخط ثابت العرض + يحافظ على المحتوى في تنسيقه الأصلي ويتجاهل كل التنسيقات:

<pre>  
    Hello    in   our website,
    Enjoy we us,
    Good Tutorials,
    Good Articles  
</pre>

{Outputs} الكود السابق:

  
Hello    in   our website,
Enjoy we us,
Good Tutorials,
Good Articles

HTML <samp> Element

يُستخدم عنصر samp لتمثيل مخرجات البرنامج.

عادةً ما يتم عرض النص المكتوب داخل عنصر samp بخط أحادي المسافة (الافتراضي للمتصفح):

<h3>System Message:</p>
<p>
    <samp>This picture not found, <br>
        Press on Esc to exit!
    </samp>
</p>

{Outputs} الكود السابق:

System Message:

This picture not found, Press on Esc to exit!

HTML <var> element

يُستخدم عنصر الـ var لتعريف متغير.

يمكن أن يكون المتغير متغيرًا في تعبير رياضي أو متغيرًا في سياق برمجى:

<p class="text-left">First var is: <var>A</var>, And second var is: <var>B</var>, Two variables equal <b>20</b></p>

{Outputs} الكود السابق:

First var is: A, And second var is: B, Two variables equal 20