CSS дочерние селекторы

Question

У меня есть две метки в пределах одной, и я хочу стилизовать вторую метку, есть ли способ настроить таргетинг на вторую метку.Он должен работать на IE7

Я написал так

         <ul>
          <li>
             <label for="asi plan status">A&SI Accountable VP:</label>
             <label>Tye Schriever</label>
           </li>
            </ul>

ul li label label{color:red}

Любой другой способ ..?

Answer 1

Если вам нужен только второй ярлык и ничего больше, вы можете использовать

ul li label + label

Не нужно переопределений или CSS3 :last-child или добавление классов для работы с IE и т. Д. Хотя комментарииупомяните IE7 и IE8, имеющие проблемы с селектором +, он должен работать правильно в этой ситуации.

Answer 2

вы можете использовать свойство css2 :first-child, чтобы определить ваши свойства для второй метки в общем и через first-child вы можете переопределить свойство css для первого label следующим образом:

label{color:red}
label:first-child{color:yellow}

это поддерживаетсяIE7 также, но подход другой.

Answer 3

Вы можете использовать :last-child -selector , но это не поддерживается Internet Explorer.

li label:last-child { color:red }

Назначить атрибут класса метке вместо этого, чтобы он правильно работал во всех браузерах.

Answer 4

Как уже упоминали другие, есть законные селекторы CSS для достижения того, что вы хотите, но IE7 не поддерживает эти селекторы.

Когда мне нужно пропатчить поддержку :last-child в IE7, я используюэтот метод с jQuery:

$('li label:last-child').addClass('last-child');

И затем в моем CSS я могу использовать использование

li label.last-child {
  /* some styles here */
}

Поэтому мы используем превосходную поддержку селектора jQuery CSS для применения класса к элементам, которые вы хотитестиль, а затем стиль их в CSS>