我有一個盒子列表，當鼠標懸停時，我想要顏色反轉。
div {
background-color: #000;
color: #fff;
}
所以我進一步添加了以下代碼：
div:hover {
background-color:#fff;
color:#000;
}
但是… 盒子看起來不像"一個盒子"。所以我添加了邊框：
div:hover {
background-color:#fff;
color:#000;
border: 4px solid #000;
}
但由於邊框是添加在盒子外部，所以看起來很奇怪。
我找到的最佳方法是使用box-shadow屬性：
div:hover {
background-color:#fff;
color:#000;
box-shadow: inset 0px 0px 0px 4px #000;
}
以下是結果：
