div被选中，并且单击它时会出现边框

我的wordpress网站的徽标位于div中

以下是链接

当我单击徽标时, 会出现一个巨大的矩形框。我已经尝试过outline属性和use-select属性, 但是它仍然存在。

#1

在代码的相关部分(下面显示以供将来参考)中, 你需要包括以下CSS：

.custom-logo-link:focus {
    outline: none;
}

由于当前集中在custom-logo-link上, 因此正在应用以下CSS：

@media only screen and (min-width: 768px)
    a:focus, button:focus, .button.alt:focus, input:focus, textarea:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus {
        outline-color: #7c7235;
} 
a:focus, button:focus, .button.alt:focus, input:focus, textarea:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus {
    outline-color: #7c7235;
}
a:focus, input:focus, textarea:focus, button:focus {
    outline: 2px solid #96588a;
}

以及chrome的通用：focus。

你现有的(旧)代码：

/**
 * Header
 */
.site-header {
  background-color: #2c2d33;
  padding-top: 1.618em;
  padding-bottom: 1.618em;
  color: #9aa0a7;
  background-position: center center;
  position: relative;
  z-index: 999;
  border-bottom: 1px solid transparent; }
  .site-header .site-logo-anchor, .site-header .site-logo-link, .site-header .custom-logo-link {
    display: block;
    margin-bottom: 0; }
    .site-header .site-logo-anchor img, .site-header .site-logo-link img, .site-header .custom-logo-link img {
      width: 100%;
      max-width: 210px; }
  .site-header .widget {
    margin-bottom: 0; }

.home.blog .site-header, .home.page:not(.page-template-template-homepage) .site-header, .home.post-type-archive-product .site-header {
  margin-bottom: 4.235801032em; }

.no-wc-breadcrumb .site-header {
  margin-bottom: 4.235801032em; }

.no-wc-breadcrumb.page-template-template-homepage .site-header {
  margin-bottom: 0; }

.header-widget-region {
  position: relative;
  z-index: 99; }

.site-branding {
  float: left;
  margin-bottom: 0;
  width: calc( 100% - 120px); }
  .site-branding .site-title {
    font-size: 2em;
    letter-spacing: -1px;
    margin: 0; }
    .site-branding .site-title a {
      font-weight: 700; }
  .site-branding .site-description {
    font-size: 0.875em;
    display: none; }
  .site-branding .logo {
    margin: 0; }

<div class="site-branding">
			<a href="https://www.jbaat.com/" class="custom-logo-link" rel="home"><img width="616" height="626" src="https://www.jbaat.com/wp-content/uploads/2019/12/Logo-Jbaat-in-circle.png" class="custom-logo" alt="Logo Jbaat in circle" srcset="https://www.jbaat.com/wp-content/uploads/2019/12/Logo-Jbaat-in-circle.png 616w, https://www.jbaat.com/wp-content/uploads/2019/12/Logo-Jbaat-in-circle-295x300.png 295w, https://www.jbaat.com/wp-content/uploads/2019/12/Logo-Jbaat-in-circle-416x423.png 416w" sizes="(max-width: 616px) 100vw, 616px"></a>		</div>