كتابة الشفرات البرمجيّة في إطار العمل Bootstrap

من موسوعة حسوب


تعلّم كيفية عرض كتل تعليمات برمجيّة وحيدة السّطر أو متعدّدة الأسطر في إطار العمل Bootstrap.

شفرة برمجيّة ذات سطر واحد

غلِّف فقرات الشفرة البرمجيّة المكوَّنة من سطر واحد بالوسم <code>. تأكّد من تخليص Escape الأقواس الزاويّة (> و<) في وسوم HTML.

يجب أن يُكتَب العنصُر <code>&lt;section&gt;</code> على  نفس السطر.

الشفرات متعدّدة الأسطر

استخدم الوسم <pre> لتعليف شفرة مكوَّنة من أسطر عدّة. تأكّد كذلك من من تخليص الأقواس الزاويّة في الشفرة للحصول على عرض صحيح. تمكن إضافة الصّنف ‎.pre-scrollable الذي يحدّد ارتفاعًا أقصى قدره 350px ويوفّر شريط تمرير عموديا.

<pre><code>&lt;p&gt;مثال على نصّ...&lt;/p&gt;
&lt;p&gt;سطر ثان من المثال...&lt;/p&gt;
</code></pre>

المتغيّرات

استخدم الوسم <var> للإشارة إلى المتغيّرات.

<var>y</var> = <var>m</var><var>x</var> + <var>b</var>

مُدخَلات المستخدم

استخدم الوسم<kbd> للإشارة إلى أنّ المُدخَل يأتي عادةً عن طريق لوحة مفاتيح:

نفّذ الأمر<kbd>cd</kbd> متبوعًا باسم المُجلَّد للانتقال إلى المجلّد المذكور.<br>
انقر على الزرّيْن<kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd> لتعديل الإعدادات

نموذج مُخرَجات

استخدم الوسم <samp> للإشارة إلى أنّ المقصود نموذَج لمُخرجات برنامج.

<samp>هذا نصّ مُعدّ للتعامل معه على أساس أنّه نتيجة تنفيذ برنامج حاسوبيّ</samp>

مصادر