Tabs

Tabs digunakan untuk menampilkan konten dalam tab yang bisa dipilih. Cocok untuk menampilkan kode dalam berbagai bahasa, dokumentasi multi-versi, atau konten yang dikelompokkan.

Sintaks

Gunakan ::::tabs sebagai pembungkus, dan :::tab[label] untuk setiap tab:

::::tabs:::tab[npm]npm install astro::::::tab[pnpm]pnpm add astro::::::tab[yarn]yarn add astro:::::::

Preview

Aturan Penulisan

Aturan	Keterangan
Pembungkus	Gunakan ::::tabs 4 titik dua dan tutup dengan ::::
Setiap tab	Gunakan :::tab[label] 3 titik dua dan tutup dengan :::
Label tab	Ditulis didalam [] setelah tab
Konten tab	Bisa berupa teks, code block, list dan komponen lainnya

Atribut

Tabs tidak memiliki atribut tambahan. Cukup tulis label tab di dalam [].

Catatan

Tab pertama akan aktif secara default

• Label tab bisa berupa teks biasa atau inline code
• Setiap tab bisa berisi konten yang berbeda-beda
• Tabs bisa berisi callout, code block, list, atau komponen lain di dalamnya
• Tabs bersifat interaktif: klik tab untuk berpindah
• Tabs adalah komponen block, jadi harus ditulis di baris sendiri

Lihat Juga

• Steps — Panduan langkah-demi-langkah
• Accordion — Konten yang bisa dilipat
• Callout — Menyorot informasi penting