CSS jQuery селектор nth child

Question

CSS jQuery селектор nth child

0

    <table>
     <tr>
          <td>1</td>
     </tr>
      <tr>
          <td>2</td>
     </tr>
      <tr>
          <td>3</td>
     </tr>
      <tr>
          <td>4</td>
     </tr>
      <tr>
          <td>5</td>
     </tr>
      <tr>
          <td>6</td>
     </tr>
      <tr>
          <td>7</td>
     </tr>
     <tr>
          <td>8</td>
     </tr>
    </table>

Я хочу покрасить 4-й, 5-й и 6-й цвета с другим цветом, как выбрать его через n-й ребенок. испытывая трудности с пониманием этого

table tr:first-child{background-color: #F57676;}
table tr:nth-child(even){background-color: #F5B3B3;}
table tr:nth-child(odd){background-color: #F2DCDC;}
table tr:last-child{ background-color: #F57676;}

благодаря

StingHands 02 дек. 2013, в 09:09

Источник

3

Вы уже пробовали что-нибудь с вашей стороны?
NoobEditor 02 дек. 2013, в 07:47
1

Вот это api.jquery.com/nth-child-selector
sravis 02 дек. 2013, в 07:48
1

см. api.jquery.com/nth-child-selector
Kishori 02 дек. 2013, в 07:48

Показать ещё 1 комментарий

Теги:

jquery

css

4 ответа

1

Например, вы можете использовать. Здесь мы выбираем четвертый и пятый дочерние элементы таблицы.

table tr:nth-child(4),
table tr:nth-child(5) {
    background-color: red;
}

Bas van Dijk 02 дек. 2013, в 05:16

0

Пытаться:

$("table").find("tr:eq(3),tr:eq(4)").addClass("cls");

DEMO.

Hiral 02 дек. 2013, в 06:48

0

Как правило, я склонен не использовать N-й ребенок, поскольку его обратная совместимость весьма ограничена. Я рекомендую вместо этого использовать имена классов html/css, такие как "class=" 4th ", поскольку это будет работать с более старыми браузерами.

Если вы планируете реализовать его в jquery любым способом, используйте этот ссылочный сайт

Jack Dalton 02 дек. 2013, в 06:02

0

это правда, но становится все менее актуальным, поддерживает ie9 + и все другие основные браузеры
roo2 02 дек. 2013, в 07:58
0

Согласитесь, однако, на крупных сайтах такие места, как Китай и страны Ближнего Востока, по-прежнему имеют высокий процент таких вещей, как ie6. В целом я стремлюсь к IE9 вверх, но это просто то, что нужно иметь в виду.
Jack Dalton 12 май 2014, в 09:32

Ещё вопросы

Вы уже пробовали что-нибудь с вашей стороны?
это правда, но становится все менее актуальным, поддерживает ie9 + и все другие основные браузеры
Согласитесь, однако, на крупных сайтах такие места, как Китай и страны Ближнего Востока, по-прежнему имеют высокий процент таких вещей, как ie6. В целом я стремлюсь к IE9 вверх, но это просто то, что нужно иметь в виду.

roo2 · Accepted Answer · 2013-12-02T05-38-00.000Z

Пример jsFiddle

Используйте синтаксис nth-child (n + x) для указания смещения, это выбирает четвертую строку и выше

tr:nth-child(n+4) {
  background-color: #FAA;
}