Cara Membuat Pagination dengan Hover Color di W3.CSS

Sangat menyedihkan jika seseorang yang anda kenal menjadi seseorang yang telah anda kenal. Pada kesempatan yang sudah diberikan kali ini saya akan berbagi ilmu kepada kalian tentang bagaimana Cara Membuat Pagination dengan Hover Color di W3.CSS.

Tutorial kali ini di ajarkan Cara Membuat Pagination dengan Hover Color di W3.CSS. Hover color nya bisa kita buat sesuka kita teman-teman. Jika kalian ingin membuat hover nya tiap tombol berbeda-beda warna juga tidak apa-apa teman-teman hehe.

Oke langsung saja, seperti biasa pertama silahkan teman-teman buat terlebih dahulu file index.html nya.

Kemudian, isi di bagian <head> nya link untuk menghubungkan html kita dengan library CSS nya W3.CSS.

<link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">

Setelah itu, isi di bagian <body> tag-tag seperti gambar di bawah,

<div class="w3-container">
  <h2>Pagination Hover Color</h2>
  <p>Coba teman-teman arahkan kursor nya di tiap tombol pagination nya.</p>

  <ul class="w3-pagination">
    <li><a href="#" class="w3-hover-purple">&laquo;</a></li>
    <li><a href="#" class="w3-hover-green">1</a></li>
    <li><a href="#" class="w3-hover-red">2</a></li>
    <li><a href="#" class="w3-hover-blue">3</a></li>
    <li><a href="#" class="w3-hover-black">4</a></li>
    <li><a href="#" class="w3-hover-orange">&raquo;</a></li>
  </ul>
</div>

Bagaimana teman-teman untuk Cara Membuat Pagination dengan Hover Color di W3.CSS nya? cukup mudah bukan?

Sekian untuk tutorial kali ini, semoga bermanfaat.

Terima kasih

Cara Membuat Pagination dengan Hover Color di W3.CSS

Kategori