0

我有一个带孩子的菜单。
我想在选择孩子时更改父母和孩子的背景，并且只在选择父母时更改父母的背景。

我已经搜索过它，但它似乎无法正常工作。我知道很多人都问过这个问题。我试过用jquery来做，但我做错了。

到目前为止，我的代码如下：

HTML

<div class="menu">
  <ul>
    <li><a id="home" href="index.php">Home</a></li>
    <li><a href="Programming.php">Programming Language</a>
      <ul>
        <li><a href="Programming_HTML.php">HTML</a></li>
      </ul>
    </li>
    <li><a href="Project.php">Project</a>
      <ul>
        <li><a href="Project_Calculator.php">Calculator</a></li>
        <li><a href="Project_ImageSlider.php">Image Slider</a></li>
      </ul>
    </li>
  </ul>
</div>

CSS

.menu { font-family: arial, sans-serif; width:1190px; text-align: center; font-size:11px; z-index:100;}
.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000;  height:51px; text-align:center; color:#000; background:#ddd; line-height:50px; font-size:15px; overflow:hidden; box-shadow:inset 0 0 10px #000000;}
.menu ul {padding:0; margin:0; list-style: none;}
.menu ul li {float:left; position:relative; background: #F16529; width: 238px;}
.menu ul li ul {display: none;}
.menu ul li ul li a{ background:#36f;}
.menu ul li ul li{margin-left: 10px; width: 215px; border-left: 1px solid #000; border-bottom: 1px solid #000; }
.menu ul li a{border-right: 1px solid #000;}
#home{border-left: 1px solid #000;}
.menu ul li:hover a {color:#fff; background:#36f;}
.menu ul li:hover ul {display:block; position:absolute; top:51px; left:0;}
.menu ul li:hover ul li ul {display: none;}
.menu ul li:hover ul li a {display:block; background:#ddd; color:#000;}
.menu ul li:hover ul li a:hover {background:#FF6A00; color:#fff;}
.menu ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;}
.menu ul li:hover ul li:hover ul.left {left:-105px;}


说到 jquery，我在想 clickfunction。
我也知道我需要在 CSS 中添加一个活动类。
欢迎您查看菜单，它与这个 div 非常相配，围绕它。 

#top-wrap{float:center; width: 100%; height: 51px; display: block; background-color: #000; -webkit-box-shadow: inset 0 10px 15px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 10px 15px rgba(0, 0, 0, 0.1); box-shadow: inset 0 10px 15px rgba(255, 255, 255, 0.6);}
4

1 回答 1

0

您希望 BG 在单击后保持橙色，还是返回蓝色？如果是后者，只需将其添加到 CSS 中：

.menu ul li:active a {color:#fff; background:#FF6A00;}

这是我唯一能用纯 CSS 计算出来的东西......

于 2013-10-30T18:58:04.530 回答