1

我想包裹<a>一个div。当我添加它时，边框的颜色保持与文本颜色相同的橙色。

当我在 Chrome 的开发人员工具中切换规则时，橙色变为黑色color，但我显然不希望查看器被要求做同样的事情。

请注意，只有 Block Fuse 项目框存在此问题，其他框都没有，因为它们没有<a>标签。

我已经在以下位置复制了这个问题：

  • Chrome 版本 23.0.1271.95
  • Chrome 金丝雀版本 25.0.1342.0

这是相关的html：

<a href="projects/blockfuse.html">
<div class="project">
    <div class="projectTitle">Block Fuse</div>
    <div class="projectDescription">Block Fuse is a game about knocking as many blocks onto the floor as possible.
        <div class="projectImage"><img class="projectImage" src="images/BlockFuse.png"></img></div>
    </div>
</div>
</a>

这是相关的CSS：

div.projectTitle {
    text-align: center;
    font-size: 20pt;
    color: #F90;
    padding: 20px 0px 15px 0px;
    font-family: "Arial", "Helvetica", Sans-Serif;
    border-radius: 20px 20px 0px 0px;
    border-style: solid;
    border-width: 0px 0px 1px 0px;
    border-color: black;
    background-color: #444;
}

div.projectDescription {
    height: 310px;
    font-family: "Arial", "Helvetica", Sans-Serif;
    font-size: 12pt;
    color: #EEE;
    text-shadow: 1px 1px 1px #000;
    background-color: #777;
    padding: 17px;
    border-radius: 0px 0px 20px 20px;
}

显示橙色底部边框，注意只有这个项目框有这个问题，因为它有一个标签

在我的网站上试用：http ://www.rollingkinetics.com/index.html

4

3 回答 3

4

我认为这里的问题是您需要为a:visited选择器设置颜色。我最初没有看到这个问题，但是在我点击链接后我看到了。

于 2012-11-30T14:49:09.933 回答
1

我建议将超链接放在div 中。正如我所经历的那样，这会产生更好的行为。
（在这种情况下，链接将应用于 div 的子项，并且外部不会获得额外的 a:link 颜色）

于 2012-11-30T14:49:30.317 回答
0

在超链接上不做文字装饰只需添加这个

a{
  text-decoration:none;}
于 2012-11-30T14:42:36.427 回答