الفرق بين المراجعتين ل"HTML/kbd"

من موسوعة حسوب
اذهب إلى التنقل اذهب إلى البحث
ط (استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}')
(إضافة قسمين ومثال)
سطر 4: سطر 4:
 
مثال عن استخدام العنصر <code><nowiki><kbd></nowiki></code>:
 
مثال عن استخدام العنصر <code><nowiki><kbd></nowiki></code>:
 
<syntaxhighlight lang="html">
 
<syntaxhighlight lang="html">
<p>Type the following in the Run dialog:
+
<p>أدخل الأمر الآتي في الطرفية <kbd>ls -lh</kbd> لعرض محتويات المجلد الحالي.</p>
  <kbd>cmd</kbd><br />Then click the OK button.</p>
 
  
<p>Save the document by pressing
+
<p>احفظ المستند بالضغط على <kbd>Ctrl</kbd> + <kbd>S</kbd></p>
  <kbd>Ctrl</kbd> + <kbd>S</kbd></p>
 
 
</syntaxhighlight>
 
</syntaxhighlight>
  
 +
== بطاقة العنصر ==
 
{| class="wikitable" style="width: 100%;"
 
{| class="wikitable" style="width: 100%;"
 
|-
 
|-
سطر 49: سطر 48:
 
== ملاحظات ==
 
== ملاحظات ==
 
* يمكن تعريف قاعدة CSS تُطبَّق على المحدد <code>kbd</code> لتغيير الخط ذي العرض الثابت الافتراضي إلى خطٍ آخر.
 
* يمكن تعريف قاعدة CSS تُطبَّق على المحدد <code>kbd</code> لتغيير الخط ذي العرض الثابت الافتراضي إلى خطٍ آخر.
* عندما يُستعمَل العنصر <code><nowiki><kbd></nowiki></code> داخل العنصر <code>[[HTML/samp|<nowiki><samp></nowiki>]]</code> فسيتمثل المدخلات كما يطبعها النظام.
+
* عندما يُستعمَل العنصر <code><nowiki><kbd></nowiki></code> داخل العنصر <code>[[HTML/samp|<nowiki><samp></nowiki>]]</code> فسيُمثل المدخلات كما يطبعها النظام.
 
* عندما يحتوي العنصر <code><nowiki><kbd></nowiki></code> على عنصر <code>[[HTML/samp|<nowiki><samp></nowiki>]]</code> فسيمثِّل مدخلات تتفاعل مع مخرجات النظام، مثل اختيار أحد خيارات القائمة.
 
* عندما يحتوي العنصر <code><nowiki><kbd></nowiki></code> على عنصر <code>[[HTML/samp|<nowiki><samp></nowiki>]]</code> فسيمثِّل مدخلات تتفاعل مع مخرجات النظام، مثل اختيار أحد خيارات القائمة.
 
* عندما تضع العنصر <code><nowiki><kbd></nowiki></code> داخل عنصر <code><nowiki><kbd></nowiki></code> آخر، فسيمثل مفتاحًا أو زرًا معينًا.
 
* عندما تضع العنصر <code><nowiki><kbd></nowiki></code> داخل عنصر <code><nowiki><kbd></nowiki></code> آخر، فسيمثل مفتاحًا أو زرًا معينًا.
 +
 +
== التنسيق الافتراضي ==
 +
تعرض أغلبية المتصفحات العنصر <code><nowiki><kbd></nowiki></code> مع تغيير عائلة الخط <code>[[CSS/font-family|font-family]]</code> إلى خطٍ ذي عرضٍ ثابت <code>monospace</code>:<syntaxhighlight lang="css">
 +
kbd {
 +
  font-family: monospace;
 +
}
 +
</syntaxhighlight>
  
 
==مصادر ومواصفات==
 
==مصادر ومواصفات==

مراجعة 08:50، 19 فبراير 2018

يُمثِّل العنصر <kbd> مدخلات المستخدم ويؤدي إلى عرض النص بالخط ذي العرض الثابت الافتراضي الذي يستعمله المتصفح.

مثال عن استخدام العنصر <kbd>:

<p>أدخل الأمر الآتي في الطرفية <kbd>ls -lh</kbd> لعرض محتويات المجلد الحالي.</p>

<p>احفظ المستند بالضغط على <kbd>Ctrl</kbd> + <kbd>S</kbd></p>

بطاقة العنصر

تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي.
المحتوى المسموح محتوى عادي.
الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية.
العناصر الأب أي عنصر يقبل المحتوى العادي.
واجهة DOM HTMLSpanElement

دعم المتصفحات

Chrome Firefox Edge Safari Opera
مدعوم مدعوم مدعوم مدعوم مدعوم

الخاصيات

يمكن استخدام الخاصيات العامة في هذا العنصر.

ملاحظات

  • يمكن تعريف قاعدة CSS تُطبَّق على المحدد kbd لتغيير الخط ذي العرض الثابت الافتراضي إلى خطٍ آخر.
  • عندما يُستعمَل العنصر <kbd> داخل العنصر <samp> فسيُمثل المدخلات كما يطبعها النظام.
  • عندما يحتوي العنصر <kbd> على عنصر <samp> فسيمثِّل مدخلات تتفاعل مع مخرجات النظام، مثل اختيار أحد خيارات القائمة.
  • عندما تضع العنصر <kbd> داخل عنصر <kbd> آخر، فسيمثل مفتاحًا أو زرًا معينًا.

التنسيق الافتراضي

تعرض أغلبية المتصفحات العنصر <kbd> مع تغيير عائلة الخط font-family إلى خطٍ ذي عرضٍ ثابت monospace:

kbd {
  font-family: monospace;
}

مصادر ومواصفات