Question

<!DOCTYPE html>
<html>
<head>
     <title>
         (Test)
       </title>
</head>
<style type="text/css">
a:wrapper {background-color:#FFFFFF; color:#FF8347; text-align:center; padding:0px; text-decoration:none; font-size:40px; display:inline-block; width:192px; border-radius:0x; -moz-border-radius:0px; -webkit-border:0px;}
body{margin:0 auto; width:2500px; position;relative;}
div.navMENU{ width:100%; height:200px;}
div.navMENU ul{list-style-type:none; padding:0px; margin:0 auto;}
div.navMENU li{float:left; padding:0px; margin:0px;}
div.navMENU a{display:inline-block; width:192px; border-radius:0x; -moz-border-radius:0px; -webkit-border:0px; background-color:#777580; color:#FF7533; text-align:center; text-decoration:none; font-size:40px;}
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
</style>
</head>
<div class="navMENU"
<nav>
<ul>
    <li><a href="home.html">Home</a> </li>
    <li><a href=""> 2</a> </li>
    <li><a href=""> 3</a> </li>
    <li><a href=""> 4</a> </li>
    <li><a href=""> 5</a> </li>
    <li><a href=""> 6</a> </li>
    <li><a href=""> 7</a> </li>
    <li><a href=""> 8</a> </li>
    <li><a href=""> 9</a> </li>
    <li><a href=""> 10</a> </li>
</ul>
</nav>
</body>
</head>
</html>

答：悬停不起作用，我该如何解决？我认为不需要home.html文件，告诉我你是否需要它来帮助我。我做错了什么？

详细细节细节需要我需要这么多细节网站告诉我要添加更多细节

Answer 1

那是因为你写了a:wrapper而不是a:hover。

还有其他问题，例如，您有一个剩余</head>，我猜-webkit-border:0px;应为-webkit-border-radius: 0px;（2X），position;relative;应为{{1} （带冒号）和position: relative;缺少结束<div class="navMENU"和结束>标记。

所以，如果我可以这样说，你的代码有点草率。您当前的问题和可能出现的问题可能是由于此类错误导致的，因此最好仔细检查代码是否存在错误。请务必使用W3 validator并使用具有正确语法突出显示的编辑器来帮助您发现这些错误。

Answer 2

只需删除:wrapper并添加:hover即可使用

以下是片段检查...

＆＃13;

body {
  margin: 0 auto;
  width: 2500px;
  position;
  relative;
}
div.navMENU {
  width: 100%;
  height: 200px;
}
div.navMENU ul {
  list-style-type: none;
  padding: 0px;
  margin: 0 auto;
}
div.navMENU li {
  float: left;
  padding: 0px;
  margin: 0px;
}
div.navMENU a {
  display: inline-block;
  width: 192px;
  border-radius: 0x;
  -moz-border-radius: 0px;
  -webkit-border: 0px;
  background-color: #777580;
  color: #FF7533;
  text-align: center;
  text-decoration: none;
  font-size: 40px;
}
div.navMENU a:hover {
  background-color: #FFFFFF;
  color: #FF8347;
  text-align: center;
  padding: 0px;
  text-decoration: none;
  font-size: 40px;
  display: inline-block;
  width: 192px;
  border-radius: 0x;
  -moz-border-radius: 0px;
  -webkit-border: 0px;
}
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

＆＃13;

<div class="navMENU">
  <nav>
    <ul>
      <li><a href="home.html">Home</a> 
      </li>
      <li><a href=""> 2</a> 
      </li>
      <li><a href=""> 3</a> 
      </li>
      <li><a href=""> 4</a> 
      </li>
      <li><a href=""> 5</a> 
      </li>
      <li><a href=""> 6</a> 
      </li>
      <li><a href=""> 7</a> 
      </li>
      <li><a href=""> 8</a> 
      </li>
      <li><a href=""> 9</a> 
      </li>
      <li><a href=""> 10</a> 
      </li>
    </ul>
  </nav>
</div>

＆＃13;

A：悬停不起作用，我搞砸了

2 个答案: