CSS按下鼠标时的效果是指当用户在浏览器中点击页面上的链接、按钮或其他交互元素时，通过CSS样式来实现下沉和变色等效果，从而提高用户体验。

/* 定义一个CSS class */.active {background-color: #ccc;border: 1px solid #666;color: #333;box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);}

在实现该效果时，我们可以定义一个CSS class，将所有需要按下鼠标时应用该效果的元素都加上这个class即可。例如：

<!-- HTML代码 --><button >点击我</button>

以上代码会使得按钮在按下鼠标后出现灰色的背景和黑色的边框。上述CSS样式中，background-color定义了背景颜色，border定义了边框，color定义了文字颜色，box-shadow定义了阴影效果。

我们也可以通过CSS伪类:hover来实现鼠标悬浮时的效果。例如：

/* 定义一个CSS class */.hover {background-color: #ccc;color: #333;}<!-- HTML代码 --><button >悬浮在我上面</button>

以上代码会使得按钮在鼠标悬浮时出现灰色的背景和黑色的文字。伪类:hover表示鼠标悬浮时应用该样式，它可以应用于任何元素上。

总结起来，CSS按下鼠标时的效果和鼠标悬浮时的效果都能够通过CSS样式来实现，可以提高用户体验，增强页面交互性。