Single post in Guide to CSS (Beginner & Intermediate) [In Progress]
Forum Index > PokéFarm > Guides > Guide to CSS (Beginner & Intermediate) [In Progress] >
You can just add the tab like normal.
Adding tabs:
[sc=tabbed_interface horizontal]
[ul]
[li]Title 1[/li]
[li]Title 2[/li]
[li]Title 3[/li]
[/ul][
][sc=tab]contents 1[/sc][
][sc=tab]contents 2[/sc][
][sc=tab]contents 3[/sc][/sc]
Editing colors:
.tabbed_interface{
&>ul>li{
color: LI_COLOR;
background: LI_BACKGROUND_COLOR;
border: 1px solid LI_BORDER_COLOR;
}
&>.tab{
color: TAB_COLOR;
background: TAB_BACKGROUND_COLOR;
border:1px solid TAB_BORDER_COLOR;
}
}
You can also use images as the backgrounds if u want with background-image:url('BACKGROUND_URL');
Ex:
- Title 1
- Title 2
- Title 3
contents 1
contents 2
contents 3
Example Code
[sc=tabbed_interface horizontal]
[ul]
[li]Title 1[/li]
[li]Title 2[/li]
[li]Title 3[/li]
[/ul][
][sc=tab]contents 1[/sc][
][sc=tab]contents 2[/sc][
][sc=tab]contents 3[/sc][/sc]
[style]
.tabbed_interface{
&>ul>li{
color: white;
background-image: url('https://i.imgur.com/0ieOsSH.jpg');
border:1px solid black;
}
&>.tab{
color: black;
background: white;
box-shadow:none;
border:1px solid black;
}
} [/style]
- about me
- collecting
- secrets
Yeah / He
link text here NEW ABOUT ME!!!!SECRET TEXT MWAHHAHA
Ima edit this eventually, but for now es blank 
wawwwww a fancy thingy!!!!
credits
Code @Colorful
Background from Pokemon Mystery Dungeon: Rescue Team DX
Profile picture from event colander 2021
Profile Picture by @crazyMissdream | Shop
Running Mew by @KitKatKutie2 | Shop