Twitter bootstrap 从SCSS编译的盒影,但在Firebug中未显示;使用指南针

Twitter bootstrap 从SCSS编译的盒影,但在Firebug中未显示;使用指南针,twitter-bootstrap,sass,compass-sass,html5boilerplate,Twitter Bootstrap,Sass,Compass Sass,Html5boilerplate,我正在使用WordPress的Bones HTML5样板初学者模板(也链接到Bootstrap CDN)。我已在主.scss文件中导入compass: @导入“指南针”; 当我在部分中使用以下标记时: .wp-image-6{ @包括盒子阴影(5px,5px,3px,#888); 边界半径:2米; } 在my style.css文件中,代码似乎编译得很好: .wp-image-6{ -网络工具包盒阴影:5px,5px,3px,#8888888; -莫兹盒阴影:5px,5px,3px,#888

我正在使用WordPress的Bones HTML5样板初学者模板(也链接到Bootstrap CDN)。我已在主.scss文件中导入compass:

@导入“指南针”;
当我在部分中使用以下标记时:

.wp-image-6{
@包括盒子阴影(5px,5px,3px,#888);
边界半径:2米;
}
在my style.css文件中,代码似乎编译得很好:

.wp-image-6{
-网络工具包盒阴影:5px,5px,3px,#8888888;
-莫兹盒阴影:5px,5px,3px,#8888888;
盒影:5px,5px,3px,#8888888;
边界半径:2米;
}
但是,当我使用Firebug(或Safari)检查时,选择器仅显示边界半径(这对我正在测试的图像有效)

.wp-image-6{
边界半径:2米;
}
如果我从浏览器中查看style.css(例如,通过单击头部部分中的style.css链接),它将显示样式:

.wp-image-6{
-网络工具包盒阴影:5px,5px,3px,#8888888;
-莫兹盒阴影:5px,5px,3px,#8888888;
盒影:5px,5px,3px,#8888888;
边界半径:2米;
}

有人能解释为什么会发生这种情况(盒子阴影不起作用)?谢谢您的帮助。

在mixin中,您不需要逗号。使用

@包含盒影(5px 5px 3px#888)

而不是:


@包括盒影(5px,5px,3px,#888)

它不会出现在firebug中,因为这些都是计算值,而不是样式表中必需的值。您在上使用的
.wp-image-6
类是什么元素?我觉得这是一个特殊的问题。我尝试了一些不同的元素。我尝试在任何div、边栏和img标记(上面描述的类的元素)上添加阴影。什么都不管用。计算这些值有什么关系?另外,我刚刚尝试了包含边界半径:
@include border radius(1em),它工作了,编译到style.css文件并修改了图像。看来我的设置覆盖了box shadow,不确定,谢谢你的帮助!哦,你知道吗。。。这是因为你有不必要的逗号。试试看包含盒影(5px 5px 3px#888)而不是
@包含框阴影(5px,5px,3px,#888)