Template:Tabs

Revision as of 21:28, 14 April 2025 by Selfice (talk | contribs) (Created page with "<includeonly>{{#invoke:Tabs|main}}</includeonly><noinclude> {{documentation}} Category:Functional_templateszh:Template:Tabs </noinclude>")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
[ View | Edit | History | Purge ]Documentation page

Usage

Parameters

x=Number 1-∞

  • General
    1. color=, the color of the template, there are only seven colors and one default theme:
      • green
      • red
      • blue
      • yellow
      • purple
      • orange
      • black (default)
    2. DefaultTab: Specifies which tab to display when the page loads, default value is 1;
    3. LabelPadding: Specifies the padding inside the label, default value is 2px;
    4. LabelBorderColor: Specifies the side border color of the selected label, default value is #aaa;
    5. LabelBackgroundColor: Specifies the background color of the selected label, default value is the background color of the page body;
    6. LabelColor: Specifies the top border color of the selected label, default value is green;
    7. TextBorderColor: Specifies the border color of the displayed text, default value is #aaa;
    8. TextBackgroundColor: Specifies the background color of the displayed text, default value is white; if setting a transparent background with hexadecimal color code doesn't work, use rgba(R,G,B,alpha).
    9. TextPadding: Specifies the padding inside the displayed text, default value is 20px 30px when color is not set, and 1em when color is set;
    10. AutoWidth: Makes tabs no longer take up the entire row, to enable, you must pass the value 【yes】, default value is no;
    11. float: Makes tabs no longer take up the entire row while floating left or right, to enable, you must pass the value 【left】 (left float) or 【right】 (right float), default value is no;
    12. style: Styles for the outer frame.
  • Display content
    • btx=, specifies the name of the displayed tab.(Mandatory) Currently (thanks to a fix on the common.js page), if the bt item is not filled, it will automatically skip that tab, which can be used for special page implementations. For usage examples, see Template:KanColle:Artist Information.
    • bticonx=, the icon to the left of the tab name, can be text or an image, default is no icon. Recommended image size is 16px. If not used, do not include this parameter.
    • tabx=, the content of the tab.
    • LabelSide: Specifies the position of the label and its top border (side borders are on either side of the top border), optional values are top (default), bottom, left, right;
    • LabelColorSideReverse: Specifies whether to reverse the label top border position (e.g., when the label position is on the left left, the label top border is on the right, and the original position is considered a side border), enabled when the value is 1, on, yes, or true;
    • DividerSize: Specifies the gap between label and text, accepts only positive numbers, unit is , default value is 0 (LabelColorSideReverse is not true), 2 (LabelColorSideReverse is true).

Examples

General usage

{{tabs
|color=green
|bt1=COVID-19 Pandemic
|tab1=Dingdong Chicken, Big Dog Bark, Kangaroo Chicken, Pig Show, Meet Tank Horse
|bt2=Reasonable Words
|tab2=otto, Shiny Dog, Mountain Mud If, Reasonable Words, Chestnut Head, Wow, Stick Mother
|DefaultTab=1
}}

Dingdong Chicken, Big Dog Bark, Kangaroo Chicken, Pig Show, Meet Tank Horse

otto, Shiny Dog, Mountain Mud If, Reasonable Words, Chestnut Head, Wow, Stick Mother

Multiple items

{{tabs
|color=green
|bt1=2005
|bticon1=[[File:Turtle emoji.png|16px]]
|tab1=Hong Kong Disneyland opened
|bt2=2006
|bticon2=[[File:Turtle emoji.png|16px]]
|tab2=International Astronomical Union redefined planets
|bt3=2007
|bticon3=[[File:Turtle emoji.png|16px]]
|tab3=Apple's iPhone (1st gen) launched
|bt4=2008
|bticon4=[[File:Turtle emoji.png|16px]]
|tab4=Subprime mortgage crisis
|bt5=2009
|bticon5=[[File:Turtle emoji.png|16px]]
|tab5=South Korea's Jo Doo-soon case
|bt6=2010
|bticon6=[[File:Turtle emoji.png|16px]]
|tab6=2010 Yushu Earthquake
|bt7=2011
|bticon7=[[File:Turtle emoji.png|16px]]
|tab7=North Korea's Juche 100
|bt8=2030
|bticon8=[[File:Turtle emoji.png|16px]]
|tab8=<del>World War III</del>
|DefaultTab=4
}}

Hong Kong Disneyland opened

International Astronomical Union redefined planets

Apple's iPhone (1st gen) launched

Subprime mortgage crisis

South Korea's Jo Doo-soon case

2010 Yushu Earthquake

North Korea's Juche 100

World War III

[ View | Edit | History | Purge ]The above documentation is transcluded from Template:Tabs/doc.