HTML แบบแฟ้ม <kbd>

  • หน้าก่อน <ins>
  • หน้าต่อไป <label>

กำหนดและการใช้งาน

<kbd> แท็กนี้ใช้เพื่อกำหนดการป้อนแบบแปลง และเนื้อหาของมันจะแสดงด้วยแบบอักษรเท่ากันโดยเริ่มต้นจากตัวอักษรที่แบบอักษรเท่ากันของเบราเซอร์:

คำเตือน:แท็กนี้ยังไม่ถูกทำให้หมดประโยชน์ แต่คุณสามารถใช้ CSS ในการทำให้มีผลลัพธ์ที่ดีขึ้น (ดูตัวอย่างด้านล่างนี้):

ดูเพิ่มเติมที่:

แท็ก รายละเอียด
<code> กำหนดการป้อนแบบแปลงที่เป็นตัวอย่างของโปรแกรมคอมพิวเตอร์:
<samp> กำหนดการป้อนแบบแปลงทางกีบ:
<var> กำหนดตัวแปร:
<pre> กำหนดข้อความที่เป็นรูปแบบการจัดเก็บข้อมูล:

ดูเพิ่มเติมที่:

ตัวเรียน HTML:HTML ฟอร์แ�ร์แมตติ้งข้อความ

คู่มืออ้างอิง HTML DOM:องค์ประกอบ Kbd

ตัวอย่าง

ตัวอย่าง 1

กำหนดข้อความบนเอกสารเป็นการป้อนแบบแป้นแปลง:

<p>กรุณากด <kbd>Ctrl</kbd> + <kbd>C</kbd> ในตำแหน่งของตัวอักษรเพื่อคัดลอกข้อความ (Windows)。</p>
<p>กรุณากด <kbd>Cmd</kbd> + <kbd>C</kbd> ในตำแหน่งของตัวอักษรเพื่อคัดลอกข้อความ (Mac OS)。</p>

ลองด้วยตัวเอง

ตัวอย่าง 2

ใช้ CSS ตั้งรูปแบบสไตล์สำหรับองค์ประกอบ <kbd> ของ HTML:

<html>
<head>
<style>
kbd {
  border-radius: 2px;
  padding: 2px;
  border: 1px solid black;
}
</style>
</head>
<body>
<p>กรุณากด <kbd>Ctrl</kbd> + <kbd>C</kbd> ในตำแหน่งของตัวอักษรเพื่อคัดลอกข้อความ (Windows)。</p>
<p>กรุณากด <kbd>Cmd</kbd> + <kbd>C</kbd> ในตำแหน่งของตัวอักษรเพื่อคัดลอกข้อความ (Mac OS)。</p>
</body>
</html>

ลองด้วยตัวเอง

คุณสมบัติทั่วไป

<kbd> แบบตัวอักษรยังสนับสนุน คุณสมบัติทั่วไปใน HTML。

คุณสมบัติเหตุการณ์

<kbd> แบบตัวอักษรยังสนับสนุน คุณสมบัติเหตุการณ์ใน HTML。

การตั้งค่า CSS ปกติ

โปรแกรมบราวเซอร์ส่วนใหญ่จะแสดงค่าเริ่มต้นดังนี้ <kbd> องค์ประกอบ：

kbd {
  font-family: monospace;
}

ลองด้วยตัวเอง

การสนับสนุนโปรแกรมบราวเซอร์

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน
  • หน้าก่อน <ins>
  • หน้าต่อไป <label>