CSS как выбрать первый встречающийся элемент после другого элемента

Question

CSS как выбрать первый встречающийся элемент после другого элемента

у меня есть следующий HTML-код на странице

<h4>Some text</h4>

<p>

Some more text!

</p>

в моем css у меня есть следующий селектор для стиля элемента H4. HTML-код выше - это всего лишь небольшая часть всего кода, есть несколько div, более обернутых вокруг принадлежности к shadowbox

#sb-wrapper #sb-wrapper-inner #sb-body #myDiv h4

{

    color               : #614E43;

    margin-top          : 5px;

    margin-left         : 6px;

}

таким образом, у меня есть правильный стиль для моего элемента H4, но я также хочу, чтобы стиль тега абзаца в моем HTML. Возможно ли это с помощью CSS-селекторов? И если да, то как я могу это сделать?

537 3

html css css-selectors

3 ответов:

Comments

Ничего не найдено.

Phrogz · Accepted Answer · 2011-01-07 09:22:34

#many .more.selectors h4 + p { ... }
Это называется селектор соседних братьев и сестер.

Joel Mellon · Accepted Answer · 2012-10-25 20:41:30

для вашего буквального примера вы хотите использовать смежный селектор (+).
h4 + p {color:red}//any <p> that is immediately preceded by an <h4>

<h4>Some text</h4>
<p>I'm red</p>
<p>I'm not</p>
однако, если вы хотите выбрать все последовательные абзацы, вам нужно будет использовать общий селектор братьев и сестер (~).
h4 ~ p {color:red}//any <p> that has the same parent as, and comes after an <h4>

<h4>Some text</h4>
<p>I'm red</p>
<p>I am too</p>
это, как известно, багги в IE 7 + к сожалению.

Tom · Accepted Answer · 2012-06-07 12:35:12

просто нажмите на это, пытаясь решить этот тип вещей, которые я сам.

Я сделал селектор, который имеет дело с элементом после того, как что-то другое, чем p.
.here .is.the #selector h4 + * {...}
надеюсь, это поможет всем, кто его найдет:)