当我没有添加时，我的h1标记链接显示为下划线

Question

我的h1标记链接显示为我没有添加的蓝色下划线。我已将text-decoration设置为none，但在悬停时它仍然显示为蓝线。这是我的代码。

CSS

h1{
font-family:'Oxygen';
color:#000;
font-size:100px;
text-align:center;
margin-top:80px;
font-weight:50;
border:5px black solid;
text-decoration:none;
}
h1:hover{
color:#fff;
border:5px solid white;
text-decoration:none;
}
#h1{
height:100px;
width:600px;

margin:auto;
}

HTML

<div data-speed="1.2" data-type="background" id="search-background" class="clearfix"  style="background-attachment:fixed;">
<div id="h1">
<a href="#about"><h1>Joomgame</h1></a>
</div>
<p>Front-End Devoloper</p>
        </div>

Answer 1

将text-decoration提供给a http://jsfiddle.net/725tenf1/

#h1 a{
text-decoration:none;
}

Answer 2

那是因为它位于<a>标记

中

使用此CSS：

a > h1 {
  text-decoration: none;
}