How to Apply conditional CSS Selectors

Question

Every thing is possible by CSS3, then how I do this by CSS?

(1)

<h2> Top Test Text </h2>
<h2> Test Text <span class="a"></span> </h2>

Apply color: red to only parent h2 of class="a" not to top h2, with out adding <h2 style"color: red"> of with out adding class There have any CSS Selectors to do that? I Mean, Parent h2 will red color if .a class is present on the page.

(2)

<div class="a"> Test Text </div>
<div class="b"></div>

Apply color: red to only .a if .b class is present on the page.

once upon a time, the selector **:contains** was on W3C draft, you may find it in jQuery selectors/functions . selectors in css are conditionnal match BTW — G-Cyrillus, Mar 08 '15 at 16:24
If you have different questions, please consider asking them separately. — Hashem Qolami, Mar 08 '15 at 16:42
@GCyrillus: That's `:has()` - `:contains()` is something completely different. — BoltClock, Mar 08 '15 at 17:33
"*[Everything] is possible by CSS3*" - if only that initial premise was true. — David says reinstate Monica, Mar 08 '15 at 17:34

G-Cyrillus · Answer 1 · 2015-03-08T16:55:17.063

0

As commented: CSS cannot do this.

To answer at your comment:

In jQuery for the first example it would be:

$( "h2" ).has( "span.a" ).css( "color", "red" );

For both sub question , In jQuery you can use has() Demo: http://codepen.io/anon/pen/VYGrBv

edited Mar 08 '15 at 16:55

answered Mar 08 '15 at 16:35

G-Cyrillus

85,910
13
85
110

How to Apply conditional CSS Selectors

1 Answers1