如何仅在鼠标悬停时突出显示文章？当前，当我将鼠标悬停在Article上时，它还会突出显示所有子项。是否可以仅突出文章
在此处查看示例http://jsbin.com/ubunu/2
<style>
li:hover {background:red}
li li:hover {background:yellow}
</style>
</head>
<body>
<p id="hello">Hello World</p>
<ul>
<li>Weblog</li>
<li>Articles
<ul>
<li>How to Beat the Red Sox</li>
<li>Pitching Past the 7th Inning
<ul>
<li>Part I</li>
<li>Part II</li>
</ul>
</li>
<li>Eighty-Five Years Isn't All That Long, Really</li>
</ul>
</li>
<li>About</li>
</ul>
最佳答案
如果您只想在鼠标悬停在单词上时突出显示“文章”，则需要编辑HTML以在每个单词周围添加一些<span>标记或类似内容：
<style>
li span:hover {background:red}
li li span:hover {background:yellow}
</style>
</head>
<body>
<p id="hello">Hello World</p>
<ul>
<li><span>Weblog</span></li>
<li><span>Articles</span>
<ul>
...etc
编辑：这看起来像一个菜单-在这种情况下，您将使用链接，因此您可以定位这些链接而不是使用跨度。
关于css - 如何仅在:hover上突出显示父级li文本？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/2883811/