javascript - 当按钮处于事件状态时从按钮中移除阴影

Question

我有一个带有 javascript 的按钮。当您单击该按钮时，将出现一个隐藏框，当您单击另一个按钮时，第一个框将被第二个框替换，依此类推。当我的按钮处于事件状态时，当框可见时，它周围会出现阴影。我不想要那个!我尝试使用以下 css 代码:

.nav > button{
    width: auto;
    font-family: 'OpenSansBold';
    color: #000;
    padding: 3px;
    border: none;
    margin-right: 10px;
    margin-top: 5px;
    font-size: 15px;
    text-align: left;
    background-color: #fff;
}

button:hover{
    cursor: pointer;
    border: none;
    color: #7b1a2c;
}
button:visited{
    font-family: 'OpenSansBold';
    box-shadow: none;
}

button:active{
    box-shadow: none;
}

但是没有运气。按钮处于事件状态时是否还有其他 CSS 代码？

我对javascript一无所知，只是复制粘贴这个东西。也许这可以在 js 代码中修复？为了以防万一，我可以告诉你们:

$('div.box').slice(1).addClass('hidden');

$('.nav').children('button').on('click', function(){
    // console.log('klikk');
    $(this).data('content');

    $('.box').not('hidden').addClass('hidden');
    $( $(this).data('content')).removeClass('hidden');
});

Answer 1

也许你在谈论outline 属性或:focus 伪类？

试试这个:

button:active, button:focus {
  box-shadow: none;
  outline: 0;
}