基于页面主体标记的CSS突出显示菜单项_Css

基于页面主体标记的CSS突出显示菜单项

css

基于页面主体标记的CSS突出显示菜单项,css,Css,我有一个菜单，我想根据它们所在的页面突出显示子菜单项。我可以在页面上使用带有id的div标记，如果有id，则在css中突出显示该项体内 <div id="doc3"></div> 我试过了，但似乎管用。如何根据页面正文中的id更改另一个元素的样式菜单  <li id="nav-5"><a href="ssslate.do">Micro</a> <ul

我有一个菜单，我想根据它们所在的页面突出显示子菜单项。我可以在页面上使用带有id的div标记，如果有id，则在css中突出显示该项

体内

<div id="doc3"></div>

我试过了，但似乎管用。如何根据页面正文中的id更改另一个元素的样式

菜单

<!-- Menu 5 -->     
    <li id="nav-5"><a href="ssslate.do">Micro</a>
      <ul id="subnav-5">
          <li class="subnav-5-1"><a href="asdf.do">Site & Visit</a></li>
          <li><a href="ss.do">MIC</a></li>
          <li><a href="ss.do">sss</a></li>
        </ul>
    </li>

htmlbody

<body id=nav-5-body class="nav-5-1">

谢谢

在菜单中的每个项目上设置一个类，然后在CSS中使用子类来根据主体突出显示该项目

因此，主体将具有一个定义页面的类：

<body class="userEdit">

但是，这是一种使用选定项构建菜单的低效方法。最好是简单地确定在服务器上选择了哪个项目，并向该项目添加一个
selected
类，然后在CSS中选择
.selected{background color:red；}
。这将节省位并更好地扩展。
您还没有向我们展示您的实际html结构。
您指定的css样式（
#doc3#menu li#subnav-5-1 a
）将影响如下html结构：

<div id="doc3"> <ul id="menu"> <li id="subnav-5-1"><a href="somePage.html">Some page</a></li> </ul> </div>

样式将应用于
标记。
我累了，更新了帖子。。。不起作用我做错什么了吗..？请尝试删除类名中的所有破折号。不同的浏览器在类中使用破折号时表现不同。请尝试从类名中删除所有破折号。不同的浏览器在类中使用破折号时表现不同。
<body class="userEdit">

<li class="userView"> <li class="userEdit"> <li class="userAdd">

body.userEdit li.userEdit {background-color:red;} /* selected colors go here */

<div id="doc3"> <ul id="menu"> <li id="subnav-5-1"><a href="somePage.html">Some page</a></li> </ul> </div>