CODEWITHSUNDEEP
htmlcss-selectorscss
ulsci
ulsci

Reputation: 11

access html content through CSS?

<div id=menu>
 <ul>
  <li class="section-title">auto-text1</li>
  <li class="section-title">auto-text2</li>
  <li class="section-title">auto-text3</li>
 </ul>
</div>

How can I give special treatment to auto-text3 through css?

Upvotes: 1

Views: 329

Answers (3)

Paul D. Waite
Paul D. Waite

Reputation: 98796

Just to clarify the other answers, there aren’t (currently) any CSS selectors that let you select an element based on its content.

Upvotes: 1

initall
initall

Reputation: 2385

See section 6.6.5.7. of the CSS3 - future - proposal:

:last-child pseudo-class

Same as :nth-last-child(1). The :last-child pseudo-class represents an element that is the last child of some other element. 

ul > li:last-child { }

http://www.w3.org/TR/css3-selectors/#last-child-pseudo

(In your example </menu> probably is meant to be the closing </div>.)

For the time being I guess it's still best to use classes marking the first and last list element, or simple Javascript on your #menu id.

Upvotes: 3

Gumbo
Gumbo

Reputation: 655239

You could use the :nth-of-type() pseudo-class selector:

#menu > ul > li.section-title:nth-of-type(3)

This will select the third element of all li elements with the class section-title.

Upvotes: 2

Related Questions