forked from drowl87/hextra_mirror
53 lines
2.1 KiB
Markdown
53 lines
2.1 KiB
Markdown
---
|
|
title: Tabs
|
|
next: /docs/advanced/
|
|
---
|
|
|
|
## Example
|
|
|
|
{{< tabs items="JSON,YAML,TOML" >}}
|
|
|
|
{{< tab >}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{< /tab >}}
|
|
{{< tab >}}**YAML**: YAML is a human-readable data serialization language.{{< /tab >}}
|
|
{{< tab >}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{< /tab >}}
|
|
|
|
{{< /tabs >}}
|
|
|
|
## Usage
|
|
|
|
### Default
|
|
|
|
```
|
|
{{</* tabs items="JSON,YAML,TOML" */>}}
|
|
|
|
{{</* tab */>}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{</* /tab */>}}
|
|
{{</* tab */>}}**YAML**: YAML is a human-readable data serialization language.{{</* /tab */>}}
|
|
{{</* tab */>}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{</* /tab */>}}
|
|
|
|
{{</* /tabs */>}}
|
|
```
|
|
|
|
### Specify Selected Index
|
|
|
|
Use `defaultIndex` property to specify the selected tab. The index starts from 0.
|
|
|
|
```
|
|
{{</* tabs items="JSON,YAML,TOML" defaultIndex="1" */>}}
|
|
|
|
{{</* tab */>}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{</* /tab */>}}
|
|
{{</* tab */>}}**YAML**: YAML is a human-readable data serialization language.{{</* /tab */>}}
|
|
{{</* tab */>}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{</* /tab */>}}
|
|
|
|
{{</* /tabs */>}}
|
|
```
|
|
|
|
The `YAML` tab will be selected by default.
|
|
|
|
{{< tabs items="JSON,YAML,TOML" defaultIndex="1" >}}
|
|
|
|
{{< tab >}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{< /tab >}}
|
|
{{< tab >}}**YAML**: YAML is a human-readable data serialization language.{{< /tab >}}
|
|
{{< tab >}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{< /tab >}}
|
|
|
|
{{< /tabs >}}
|