如果想要透過css做一個簡單的互動效果，移動鼠標後會有不同的反應，就可以使用<hover>hover的使用其實很簡單，只需要將你希望鼠標移過後的樣子寫出來即可，
接著就讓我們直接來試試吧~~
.hover-button:hover {
background-color: lightblue;
}
原本的按鈕顏色為粉色，透過hover設定鼠標移過後按鈕變藍色。
也可以改變文字的顏色，以下為範例
.hover-text:hover {
color: red;
}
原本文字為黑色，鼠標移過後為紅色。
也可以設定元素的透明度，透過opacity去做改變
.hover-button:hover {
opacity: 0.6;
}
使用opacity去調整整個元素的透明度0為完全透明，1為完全不透明，可利用這區間的數字去調整。
除了這幾種樣式之外，還有很多可以使用，大家也可以根據自己想要的去做更改，
那<hover>的介紹就先到這啦~~~
iThome鐵人賽
看影片追技術