yang ingin dipraktekkan teknik ini, lalu menyertakan isyarat css pada style.css. Ikut beberapa langkah dibawah ini dengan seksama ya!

Cara Membuat CSS Background Berkedip di Website

Yang kalian perlukan untuk membuat css background berkedip ialah, Browser (chrome, firefox) yang paling modern, dan kalian juga mesti memiliki akses ke file server untuk merubah file css. Pada bimbingan kali ini saya menggunakan browser google chrome, filezilla untuk mencari file style.css dan notepad++ untuk melakukan editing css.

1. 1. Buka situs web di browser, lalu klik kanan dimana aja. Pilih Inspect

1. 1. Sekarang kita cari class yang mau diberikan imbas berkedip

1. 1. Gunakan tools Select Element, kemudian seret crosshair ke bagian css

      

1. 1. Nanti akan muncul class unsur bernama, .ajax-search-icon

1. 1. Lalu kita cek ke konsol CSS untuk mengetahui dimana letak file yang bersangkutan.

      

1. 1. Lokasi file sudah ditemukan dengan nama style css, tn-style.min.css,

1. 1. Sekarang tinggal masuk ke FTP. Cari file tersebut, lalu edit memakai Text Editor.

      

1. 1. Pada text editor. Kalian search (CTRL + F) .ajax-search-icon

1. 1. Jika telah didapatkan yang cocok, silahkan tambahkan arahan berikut ini kedalam barisan css

      .ajax-search-icon 
       -webkit-animation: kedip 1s infinite;
        -moz-animation:    kedip 1s infinite;
        -o-animation:      kedip 1s infinite;
        animation:         kedip 1s infinite;
      
      
      @-webkit-keyframes kedip 
      0%, 49% 
          background: #EC4C51;
          color : #fff
         
      
      50%, 100% 
          background: #f2f2f2;
          color : #000
         
      
      

       

1. 1. Kalian jangan lupa rubah .ajax-search-icon sesuai dengan unsur yang harus dirubah

1. 1. Rubah warna hex background untuk mengganti warna latar belakang yang berkedip. Ada 2 background ya.

1. 1. Rubah color untuk mengubah warna text dan icon yang ada didalam class .ajax-search-icon 

Save file yang telah di edit dan coba refresh ulang halaman website kalian. Jika sudah berkedip maka kalian sukses! Kalau tidak sukses, silahkan komentar dibawah, saya coba bantu. Sekian bimbingan css singkat kita kali ini mengenai cara membuat warna background berkedip di css. Semoga bermanfaat!