Pengenalan W3.CSS Badges

Tokyo 6
London 8

Contoh

<p>Tokyo <span class="w3-badge w3-red">6</span></p>

<p>London <span class="w3-badge w3-teal">8</span></p>

Cobalah sendiri "

---

Menampilkan Tag sebagai Masuk

Kebun Binatang London

Contoh

<div class="w3-tag w3-orange">London Zoo</div>

Cobalah sendiri "

---

Menampilkan Tag di Row a

S

SEBUAH

L

E

Contoh

<div class="w3-tag w3-red">S</div>
<div class="w3-tag w3-black" >A</div>
<div class="w3-tag w3-yellow">L</div>
<div class="w3-tag w3-black">E</div>

Cobalah sendiri "

---

menampilkan Tag

Berita Bagian New!
Komentar Selengkapnya Kemudian!

Contoh

<p>News Section <span class="w3-tag w3-yellow">New!</span></p>

<p>Comments <span class="w3-tag w3-teal">More Later!</span></p>

Cobalah sendiri "

---

Menampilkan Tanda Jalan

Falcon Ridge Parkway

---

Contoh

<div class="w3-tag w3-round w3-green" style="padding:3px 3px">
<div class="w3-tag w3-round w3-green" style="border:1px solid white">
Falcon Ridge Parkway
</div>
</div>

Cobalah sendiri "

---

Menampilkan Tags Besar

66

Contoh

<span class="w3-tag w3-jumbo w3-padding-large w3-blue">66</span>
<div class="w3-tag w3-red">
  <span class="w3-jumbo">49</span><span class="w3-xlarge">,99</span>
</div>

Cobalah sendiri "

---

Menampilkan Lencana Besar

66

Contoh

<p><span class="w3-badge w3-jumbo w3-padding-large w3-red">66</span></p>

Cobalah sendiri "

---

Menampilkan Tanda Besar

DALAM KASUS
KEADAAN DARURAT
RUN BUAT APA!

Contoh

<span class="w3-tag w3-xxlarge w3-padding w3-orange w3-center">
IN CASE OF<br>
EMERGENCY<br>
RUN LIKE HELL !
</span>

Cobalah sendiri "

Selebihnya kamu belajar sendiri di documentasi resminya http://www.w3schools.com/ 

Share: