Как выделить родительский текст li только на: hover? - PullRequest
Новая
       10

Как выделить родительский текст li только на: hover?

2 голосов
/ 21 мая 2010

Как выделить статью только при наведении мыши? Текущий, когда я наведите курсор на Статью, он также выделяет все дочерние элементы. Можно ли выделить Статьи только

см. Пример здесь 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>

Ответы [ 2 ]

3 голосов
/ 21 мая 2010

Скорее всего, вам придется возиться с позиционированием в разных браузерах, но вы можете добавить в свои стили следующее: 

li:hover ul { background: white; }
li:hover ul li:hover { background: yellow; }

Замените "белый" на любое значение гексагона, цвета или цвета, которое вам нужно.

2 голосов
/ 21 мая 2010

Если вы хотите выделить «Article» только тогда, когда указатель мыши находится над словом, вам нужно отредактировать 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

РЕДАКТИРОВАТЬ: это похоже на меню - в этом случае вы будете использовать ссылки, так что вы можете настроить таргетинг на них, а не на диапазоны.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...