Cara membuat css efek hover transition

,

hover adalah sebuah kejadian setelah selector di klik, dan transition adalah jeda waktu atau berapa lama hover itu akan melakukan aksinya, itu dengan bahasa sehari hari, kalo arti ilmiahnya saya kurang paham yang penting dsini kita belajar css bukan belajar mengerti hal2 yang membuingungkan, kalo langsung praktek kan lebih jelas, misal kita mau meng hoverkan selector dengan class "divcontainer".  

<div class="divcontainer">Contoh Class Divcontainer</div> 

Contoh cssnya:
.divcontainer{ 
backgrounnd:#888; 
color:#111; margin:20px;
 padding:30px;
}

  itu kode untuk class container dan kalu kita kasih hover berarti harus di ganti selector cssnya. contoh:  
.container:hover{ isi value }
gampang kan, dan hover bisa diisi value apa saja. terserah kalian yang penting jadi indah tampilannya yah. contoh dengan value:  
.divcontainer:hover{ 
background:#333; 
color:#eee; text-shadow:1px 1px 1px rgba(0,0,0,0.5); 
font-size:40px; 
transition:8s; 
}
berarti perintah di atas adalah, jika selector di klik atau hanya arahin mouse ke selector container maka akan berubah backgroundnya menjadi warna #333 dan font,nya akan membesar 25px dan juga warna font berganti menjadi warna #aaa, simple kan. lanjut ke transition, transition 8s itu maksudnya hovernya akan memakan waktu selama 8detik. gimana maksud nggak nih, saya anggap sudah lahya, ini preview kode diatas.
Contoh Class Divcontainer
Full scriptnya: