jquery - 单击时恢复 div 的插入/开始 css 样式

Question

我必须将复选框处理的选择修改为带有“图标”的选择。要将“图标”标记为选中，背景和阴影都应更改，因此图标看起来像是被压在里面(插图)。

我认为只需为每个类切换阴影设置就可以完成它，但它不起作用。

div.isntClicked {
  background-color: #0e8146;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 1),
  inset 0 -1px 1px rgba(0, 0, 0, 0.5);
}
div.isClicked {
  background-color: #ffa500;
  box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.5),
  inset 0 1px 1px rgba(255, 255, 255, 1);    
}

Fiddle

绿色图标未被选中和开始。橙色图标被选中并插入(不起作用)

我有 css、jquery 的问题还是有其他我不知道的问题？

Answer 1

这是你要找的吗:

fiddle - http://jsfiddle.net/tqkk5g34/1/

看起来您的 box-shadow 属性之一是负数而不是正数:

CSS:

div.isClicked {
    background-color: #ffa500;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5),
                inset 0 1px 1px rgba(255, 255, 255, 1);    
}