【问题标题】:WP hello-elementor theme: Post comment button has a weird border in ChromeWP hello-elementor 主题:发表评论按钮在 Chrome 中有一个奇怪的边框
【发布时间】:2020-10-24 11:05:46
【问题描述】:

我创建了一个带有 hello-elementor 主题的 WordPress 网站: https://taligrade-profits.000webhostapp.com/hallo-welt/

当我单击“发表评论”按钮时,该按钮会显示黑色边框(仅在 Google Chrome 中)。我想摆脱这种影响。

我还添加了一点 CSS(因为我想这样设计那个按钮):

.submit {
    background-color: #8766ff;
    border: none !important;
    color: white;
    font-size: 18px;
}

.submit:hover {
    background-color: #8766ff;
    transform: scale(1.1);
}

我无法摆脱这个“焦点”事件,它既不是边框也不是边距。而且它只出现在 Chrome 中。

我怎样才能摆脱这个焦点边框?

【问题讨论】:

    标签: css wordpress elementor


    【解决方案1】:

    您看到的边框是outline

    边框和轮廓非常相似。但是,轮廓与边框在以下方面有所不同:

    • 轮廓从不占用空间,因为它们是在元素内容之外绘制的。
    • 根据规范,虽然通常是矩形,但轮廓不一定是矩形。

    你可以像这样删除它:

    .submit:focus {
      outline: none;
    }
    

    【讨论】:

    • @CodeBrot 很高兴它成功了,欢迎来到 Stack Overflow。如果此答案解决了您的问题,请考虑将其标记为已接受:)
    猜你喜欢
    • 1970-01-01
    • 2012-01-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-03-27
    • 2014-04-28
    相关资源
    最近更新 更多