「:nth-child()」使い方として
リストなど連続している要素のn番目に対して、cssで処理を加えられる便利なものですが、
残念ながらIE8での使用はできません。
まだまだ、IE8対応のサイトもあると思うので、擬似的に:nth-child(n)が使用する方法を、
jqueryを使用して紹介します。
■html
- 1
- 2
- 3
■js
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js”></script>
<script type=”text/javascript”>
$(function(){
$(‘#test_list ul li:nth-child(3)’).each(function(){
$(this).css({color: ‘blue’});
})
});
</script>