Kbd
Metinde, menülerde ve tooltip'lerde klavye kısayollarını göstermek için bir tuş başlığı. Semantik bir <kbd> render'lar.
Aramak için Ctrl K tuşlarına bas.
<Text>
Aramak için <Kbd>Ctrl</Kbd> <Kbd>K</Kbd> tuşlarına bas.
</Text>Import
import { Kbd } from "@merid/react";Örnekler
Boyutlar
md (varsayılan) gövde metninde durur; sm menü öğelerine, tooltip'lere ve yoğun satırlara sığar.
EscEsc
<Kbd size="sm">Esc</Kbd>
<Kbd size="md">Esc</Kbd>Tuş kombinasyonları
Her tuş için bir Kbd render'la, ayracı aralarına düz metin olarak koy.
Ctrl + Shift + P
<Kbd>Ctrl</Kbd> + <Kbd>Shift</Kbd> + <Kbd>P</Kbd>API referansı
Kbd ref'ini <kbd>'ye iletir ve diğer HTML attribute'larını olduğu gibi geçirir.
| Prop | Tip | Varsayılan | Açıklama |
|---|---|---|---|
size | "sm" | "md" | "md" | Tuş başlığının boyutu. |
Stil verme
| Seçici | Değerler |
|---|---|
.mrd-kbd | Kök <kbd> |
data-size | sm · md |
Erişilebilirlik
<kbd>metni olarak okunur. Ekran okuyucuların kötü seslendirdiği sembolleri yazıyla ver: “⌃” yerine “Ctrl”i tercih et ya da glifin yanına bir VisuallyHidden ad ekle.- Kbd etkileşimli değildir; bir kısayolu belgeler, onu bağlamaz.
Kullanım ilkeleri
Yap
Her tuş için bir başlık kullan; kullanıcıların klavyelerinde gördüğü tuş adlarını yaz.
Kaçın
“Ctrl+Shift+P” gibi bir kısayolun tamamını tek bir başlığa koymak.