CSS Nth-OF-TYPE; Но как влиять только типы непосредственно последовательноHtml

Программисты Html
Ответить
Anonymous
 CSS Nth-OF-TYPE; Но как влиять только типы непосредственно последовательно

Сообщение Anonymous »

Допустим, у нас есть список предметов, с элементами сплиттера (), например, даты:

Код: Выделить всё

Big Header

Week Title A
Day 1
Day 2
Day 3
Day 4
Day 5
Day 6
Day 7
Week Title B
Day 1
Day 2
Day 3
Day 4
Day 5
Day 6
Day 7

И, скажем, у нас есть стиль CSS, который применяется к evel
s, как так:

Код: Выделить всё

#container span:nth-of-type(even){
color: red;
}
< /code>
Это даст следующий вывод: < /p>


   /** layout / setup only **/
#container {
background-color: aqua;
margin:1rem;
padding:1rem;
}
span {
display:block;
}

/** This below is the focus **/
#container span:nth-of-type(even){
color: red;
font-weight:bold;
}< /code>
    Big Header

Week Title A
Day 1
Day 2
Day 3
Day 4
Day 5
Day 6
Day 7
Week Title B
Day 1 B
Day 2
Day 3
Day 4
Day 5
Day 6
Day 7
< /code>
< /div>
< /div>
< /p>
Теперь мы видим, что на этой неделе A, 2,4,6 Дня красные - что предназначено. Но на неделе B нечетные пронумерованные дни красные. Это не то, что требуется.
без редактирования HTML (который генерируется третьей стороной), можем ли мы получить CSS всегда окрасить элемент [b] [/b] 
 
S, перечисленный непосредственно после h3
Я смотрел на код: nth-at-ytpe ()
nat hantpe (). Пытались использовать оператор CSS + , который также не делает этого (например, H3 + SPAN: nth-of-of-type (даже) {).
Предполагаемый результат в этом примере будет в том, что в любом недели, даже числовые дни отмечены как красные.
также попробовали: . #container > h3 ~ span:nth-of-type(even){
color: red;
font-weight:bold;
}
< /code>
Но это, похоже, не работает, возможно, n-й типа не может нацелиться на таких братьев и сестер? Мы не можем редактировать HTML, который отправляется от третьей стороны.

Подробнее здесь: https://stackoverflow.com/questions/797 ... -in-series
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»