Let's have fun

Let's have fun

Tabs

Info

Tabs are perfect for single-page web applications or for web pages that can display different topics.

The tabs

Tab 1

Tab 2

foto

Tab 3

tabs

The tabs are an input of the type radio, where you name each input tab: name="tab" and a unique id="" returns where then the label< /code> again refers to:

<input type="radio" name="tab" id="tab1">

<label for="tab1"">

<div class="tabs">
  <input type="radio" name="tab" id="tab1" checked>
  <label for="tab1">Tab 1</label>
  <div>
    Contents
  </div>
  <input type="radio" name="tab" id="tab2">
  <label for="tab2">Tab 2</label>
  <div>
    Contents
  </div>
</div>

Colors

Black
black
tabs-black
<div class="tabs tabs-black">
White
black
tabs-white
<div class="tabs tabs-white">
Gray
black
tabs-gray
<div class="tabs tabs-gray">
Blue
black
tabs-blue
<div class="tabs tabs-blue">
Green
black
tabs-green
<div class="tabs tabs-green">
Teal
black
tabs-teal
<div class="tabs tabs-teal">
red
black
tabs-red
<div class="tabs tabs-red">
Yellow
black
tabs-yellow
<div class="tabs tabs-yellow">
Orange
black
tabs-orange
<div class="tabs tabs-orange">
Brown
black
tabs-brown
<div class="tabs tabs-brown">
Purple
black
tabs-purple
<div class="tabs tabs-purple">
Pink
black
tabs-pink
<div class="tabs tabs-pink">