タブ
タブを使って、さまざまなオプションやバージョンを表示するためにコンテンツを整理します。
タブを使用すると、ユーザーが切り替え可能な複数のパネルにコンテンツを整理できます。タブはいくつでも追加でき、各タブの中に他のコンポーネントを含めることができます。
☝️ ここは最初のタブの中でのみ表示されるコンテンツです。
code
タブの中には任意の数のコンポーネントを追加できます。たとえば、コードブロックです。
```java:HelloWorld.java
class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello, World!");
}
}
```✌️ こちらは2番目のタブの中だけにあるコンテンツです。
このタブには
💪 こちらは3番目のタブの中だけにあるコンテンツです。
タブの例
☝️ ここは最初のタブの中でのみ表示されるコンテンツです。
タブの中には任意の数のコンポーネントを追加できます。たとえば、コードブロックです。
```java:HelloWorld.java
class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello, World!");
}
}
```
✌️ こちらは2番目のタブの中だけにあるコンテンツです。
このタブには
💪 こちらは3番目のタブの中だけにあるコンテンツです。
同じタイトルを持つタブは、ページ全体で同期されます。たとえば、複数のタブグループに JavaScript というタブタイトルが含まれている場合、あるタブグループで JavaScript を選択すると、他のタブグループでも自動的に JavaScript が選択されます。これにより、言語やフレームワークを一度選ぶだけで、その選択がページ全体に反映されます。タブは、同じタイトルを持つ コードグループ とも同期します。
タブの同期を無効にするには、::::tabs コンポーネントに sync={false} を追加します。
タブ同期を無効化する例
このタブグループは独立して動作します。
ここでタブを選択しても、他のタブグループには影響しません。