在使用 CSS 時,經常會需要設置圖片鼠標經過的效果。其中,邊框作為一種簡單而有效的方式,經常被廣泛使用。
img:hover { border: 3px solid #f5a623; }
這個代碼片段的作用是在圖片鼠標經過時,增加一個 3 像素寬的橙色邊框。其中,“img:hover”選擇器表示當鼠標懸停在 img 元素上時應用樣式。
BorderStyle 的值可以設置為 solid, dotted, dashed 等多種類型的邊框。Color 的值可以設置為顏色關鍵字或十六進制值,如 #f5a623。
通過使用 CSS 設置圖片的邊框效果,可以使頁面更加生動有趣,并提高用戶體驗。此外,此技巧也可以用于其他元素上,如鏈接、按鈕等。