Membuat Link berubah warna dan membesar ketika di sorot

A. Pendahuluan

    Pernahkan anda melihat ketika link pada blog yang ketika disorot dengan mouse, link tersebut menjadi berubah warna atau membesar hurufnya. Lihatlah gambar dibawah ini, gambar ini adalah widgets daftar isi, ketika cursor anda letakkan pada link daftar isi maka hurufnya atau warnanya akan berubah sesuai dengan setelan yang dibuat.

     
Bila anda menginginkan hal tersebut, maka berikut dijelaskan caranya.


B. Cara membuat link membesar ketika disorot
    1. Masuk ke www.blogger.com
    2. Isikan alamat email anda dan pasword
    3. Klik menu rancangan
    4. Klik menu Edit HTML
    5. Centanglah pada kotak Expand template widget
    6. Carilah kode html a:hover, untuk lebih mudah pencarian tekan tombol Ctrl+F dan 
        masukkan kode a:hover lalu tekan tombol ENTER.
    7. Perhatikan kode berikut ini :
        a:hover {
        text-decoration:underline;
        color: #FF00FF;
        font-size: 14px;
        cursor: hand;
        }
        Penjelasan :
        - pada font-size:14px;  kode ini untuk menyatakan besarnya huruf ketika disorot cursor
          ubahlah kode 14 px dengan ukuran yang dikehendaki, semakin besar angkanya maka
          semakin besar pula ukuran hurufnya. Contoh : 15px, 16px , dst. 
    8. Klik menu Pratinjau
    9. Bila hasilnya sudah sesuai dengan keinginan anda, lanjutkan pada langkah berikutnya, 
       tetapi bila belum sesuai, ulangi langkah ke-7
   10. Klik menu  Simpan Template
   11. Klik menu Lihat Blog
   12. Bila anda berhasil maka link ketika disorot, maka ukuran hurufnya akan membesar
        
C. Cara membuat link berubah warna ketika di sorot
    1. Masuk ke www.blogger.com
    2. Isikan alamat email anda dan pasword
    3. Klik menu rancangan
    4. Klik menu Edit HTML
    5. Centanglah pada kotak Expand template widget
    6. Carilah kode html a:hover, untuk lebih mudah pencarian tekan tombol Ctrl+F dan 
        masukkan kode a:hover lalu tekan tombol ENTER.
    7. Perhatikan kode berikut ini :
        a:hover {
        text-decoration:underline;
        color: #FF00FF;
        font-size: 14px;
        cursor: hand;
        }
        Penjelasan :
        - pada color:#FF00FF; kode ini untuk menyatakan warna link ketika disorot cursor
          ubahlah kode warna #FF00FF dengan warna lain yang dikehendaki. 
        - Untuk melihat kode warna bisa dilihat di artikel  KODE WARNA HTML
    8. Klik menu Pratinjau
    9. Bila hasilnya sudah sesuai dengan keinginan anda, lanjutkan pada langkah berikutnya, 
       tetapi bila belum sesuai, ulangi langkah ke-7
  10. Klik menu  Simpan Template
  11. Klik menu Lihat Blog
  12. Bila anda berhasil maka link ketika disorot akan berubah warna sesuai dengan warna
       yang anda pilih.