Question

我的博客上的标签列表存在问题（http://phobosmoon.blogspot.co.uk）。我已经调整了一点以使它看起来很好，但我无法弄清楚如何点击它后如何改变它的外观。目前，如果您点击任何标签（书评，图片等），该标签将完全透明，文本会跳起并改变颜色，边框和框会消失，看起来很奇怪。我可以在CSS / HTML中更改此位置吗？我一直在自学代码，所以我需要一步一步的指示！

谢谢，

乙

Answer 1

您在.tabs-inner .widget li a上应用了css，但是当您在相应的网页上时，您将a元素替换为span。您应该将active类添加到没有链接的li元素。然后将其添加到您的css：

.tabs-inner .widget li a, .tabs-inner .widget li.active {
    /* your code */
}

Answer 2

您的CSS样式似乎正在应用于＆lt; A＆gt;标签

确保为“.tabs-inner .widget li span”创建了一个选定的标签样式（链接标记似乎被替换为span。）

Answer 3

正在对锚标记链接

进行CSS样式

.tabs-inner .widget li a {
  display: inline-block;
  padding: .5em 1em;
  margin-right: .25em;
  color: #151537;
  font: normal normal 16px Georgia, Utopia, 'Palatino Linotype', Palatino, serif;
  -moz-border-radius: 10px 10px 0 0;
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -goog-ms-border-radius: 10px 10px 0 0;
  border-radius: 10px 10px 0 0;
  background: transparent url(//www.blogblog.com/1kt/transparent/white80.png) repeat scroll top left;
  border-right: 1px solid #d1d1d1;
}

当您转到特定页面时，之前的锚链接将更改为span 因此，您需要将其添加到样式

.tabs-inner .widget li a, .tabs-inner .widget li span {
  display: inline-block;
  padding: .5em 1em;
  margin-right: .25em;
  color: #151537;
  font: normal normal 16px Georgia, Utopia, 'Palatino Linotype', Palatino, serif;
  -moz-border-radius: 10px 10px 0 0;
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -goog-ms-border-radius: 10px 10px 0 0;
  border-radius: 10px 10px 0 0;
  background: transparent url(//www.blogblog.com/1kt/transparent/white80.png) repeat scroll top left;
  border-right: 1px solid #d1d1d1;
}

注意：使用Brewal的方法是处理这种情况的正确方法。这样，您始终可以将不同的样式应用于当前active。

标签在Blogger中点击后消失

3 个答案: