Question

我正在通过tuts +关注PSD切片和转换为HTML的教程，我正在学习相当多的东西，但是我仍然坚持一些非常讨厌的东西。当我尝试使用.inner-shadow将主阴影添加到主CTA时，我会得到一个灰色条，它不会远离我想要的颜色或位置。即使我从教程中提供的源代码文件中完全复制代码，也会发生这种情况。

这是所有相关信息（我希望，如果有任何关键缺失，请告诉我）：使用：Sublime Text 2，Winless for LESS compiling，Chrome（版本24.0.1312.57 m）和Firefox（v.18.0.2）来显示网站。相关的LESS mixin：

.inner-shadow (inset, @x: 0, @y: 0, @blur: 1px, @color: #000) {
-webkit-box-shadow: @arguments;
box-shadow: @arguments;

CTA下的代码：

.inner-shadow(inset, 0, -8px, 0, rgba(0, 0, 0, 0.2)); (rgba used to make the black less harsh and more transparent)

使用Eric Meyer的重置。

我期望的是（来自PSD文件）：

我得到的是：

请注意，要将阴影移到正确的位置，我实际上必须在.inner-shadow中为Y轴输入8px而不是-8px。不知道为什么轴被翻转，但是把-8px实际上把阴影放在盒子的顶部！

对此感到非常困惑，非常感谢任何帮助。

谢谢！

-Edit-这是它的CSS：

    -webkit-box-shadow: 0 8px 0 rgba(0,0,0,0.2);
    box-shadow: 0 8px 0 rgba(0,0,0,0.2)

Answer 1

试试这个

.inner-shadow (@inset: inset, @x: 0, @y: 0, @blur: 1px, @color: #000) {
    -webkit-box-shadow: @arguments;
    box-shadow: @arguments;
}