.like { display: inline-block; padding: 10px; color: #ddd; } .like:hover { color: #ff9800; } .like.active { color: #ff9800; }
上述代码中,通过给点赞按钮添加 like 类名,然后设置按钮的样式。当用户将鼠标悬浮在按钮上时,颜色会从灰色变为橙色。当用户点击按钮后,会添加 active 类名,颜色则会变为橙色。
通过这种简单的 CSS 设计,可以提升用户体验,增加网页的交互性。当然,这还只是 CSS 的一种应用,还有许多其他的特效和技巧,可以通过不同的 CSS 属性和方法实现。