html - 在您与页面交互(鼠标悬停)之前图标不可见

Question

我有以下问题 我在网页上有一些社交图标。第一次加载页面时，图标不可见。

当我越过图标时，它变得可见并保持可见。

.social-icons-float .social-icon {
   display: block;
   padding-bottom: 5px;
   font-size: 13px;
}

.social-icons-float .social-icon .social-count {
   display: block;
   border: 1px solid #e3e3e3;
   text-align: center;
   padding: 12px 0px;
   font-size: 24px;
   font-family: 'Titillium Web', sans-serif;
   font-weight: bold;
   color: #a0a0a0;
   position: relative;
   margin-bottom: 8px;
}

.social-icons-float .social-icon .social-count .social-arrow {
   display: block;
   overflow: hidden;
   height: 10px;
   position: absolute;
   bottom: -10px;
   width: 100%;
}

谁能帮帮我

Answer 1

这种情况有时会发生，并且在 Google Chrome 中更常见。网站上的一些图像只是 1px 的边框 block 。一旦您将鼠标悬停在它们上面，它们就会可见。

我知道，这只是错误，与此处的代码无关! :-)