使用 CSS 的 clip 屬性來達到填滿顏色效果

clip 屬性類似遮罩的概念，設定 top, right, bottom, left 四個位置的值，來達到要顯示哪裡或多大的範圍，搭配 transition 就可以讓遮罩的位置或大小達到動態效果。

製作要點：使用 2 個一樣的元素，設定他們不同顏色，但位置相同。將有顏色的元素的 clip 設定在元素之外，hover 時再將 clip 設定在元素的正確位置上。