-
Notifications
You must be signed in to change notification settings - Fork 68
Tabs
Vinicius Reif Biavatti edited this page Sep 16, 2019
·
9 revisions
The tabs is a common component in tui, and it can be found in BIOS. There is an example about it in Examples page.
These are some examples for component:
<!-- Two tabs example -->
<div class="tui-tabs">
<ul>
<li><a class="tui-tab active" data-tab-content="tab-1-content">Tab 1</a></li>
<li><a class="tui-tab" data-tab-content="tab-2-content">Tab 2</a></li>
</ul>
</div>
<div id="tab-1-content" class="tui-tab-content">
...
</div>
<div id="tab-2-content" class="tui-tab-content">
...
</div>
For this component there is an specified attribute. Use data-tui-content
to reference the content element that will be showed when the tab get actived.
This is the table with available classes for this component.
Class | Description |
---|---|
.tui-tabs |
Creates a tabs menu |
.tui-tab |
Creates a tab. Use data-tab-content attribute in the tag with the content element id |
.active |
Actives the tab. Use it for default tab selected |
.tui-tab-content |
Represents the element as the tab content |
Copyright © 2022 Vinícius Reif Biavatti
- Home
- Getting Started
- Examples
- Custom Theme
- Contributing
- Showcase
- Components
- Styles