Question

在除Chrome以外的所有浏览器中，在我的主页标题（http://gsmile.org/Word-Dev/）底部添加投影的原始代码：

.page-id-48 #main-header {
box-shadow: 0 1px 10px 0 #000000 !important;
}

修改后的代码，基于其他建议，但仍然不起作用：

.page-id-48 #main-header {
-webkit-box-shadow: 0 1px 10px 0 #000000 !important;
-moz-box-shadow: 0 1px 10px 0 #000000 !important;
box-shadow: 0 1px 10px 0 #000000 !important;
}

Answer 1

不确切知道为什么Chrome的行为如此。起初看起来像阴影被隐藏在页面加载上。在Chrome中，如果您设置＆＃34; spread＆＃34;值至少为一个Pixel而不是零（我在调试器控制台中尝试过）。

.page-id-48 #main-header {
box-shadow: 0 1px 10px 1px #000000 !important
}

在页面上播放一些不同属性的内容。

有关box-shadow的更多信息：http://www.w3schools.com/cssref/css3_pr_box-shadow.asp

这仅适用于较新版Google Chrome的旧浏览器，这绝对不会产生任何影响：

-webkit-box-shadow: 0 1px 10px 0 #000000 !important;
-moz-box-shadow: 0 1px 10px 0 #000000 !important;

Answer 2

status

看起来你有高度和展开设置为零，只是更改这些值，它应该没问题...出于审美原因我也改为黑色到深灰色

box-shadow适用于除Chrome之外的所有浏览器

2 个答案: