企業系のWebサイト制作案件でよくある、「検証対象ブラウザはWindows 7＋IE8以降です」というケース。
Windows 7でのIEの最低バージョンが8なため、2015年1月現在でも、社内システムやセキュリティ等の絡みでIE8を使用している企業は結構多いようです。
このようなケースで :last-child 疑似クラスを使う必要がある場合、以下の2つの方法があります。
1. Selectivizr を使う
このSelectivizrの特長は、非常に導入が簡単、という事につきます。
基本的にはhtmlに読み込ませるだけで使えるようになります。
加えてこのSelectivizr、CSS3の主なセレクタや疑似クラス・要素（全てではありません）が使えるようになります。
導入方法は、
- サイトからSelectivizrをダウンロード
- htmlのheadにリンクを設定（IE6〜8の条件付きコメントでの設置推奨です）
ざっくりとですが、以上2ステップで導入が完了します。
簡単ですね。
ただし、ひとつ条件がありまして、jQueryやprototypeなどのライブラリが必須になっています。
とはいえ現状では、ライブラリを使用していないサイトはあまりないので、特に気にする必要はないと思います。
記述例
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Page Title</title>
<script type="text/javascript" src="./jquery.js"></script>
<!--[if lte IE 8]>
<script type="text/javascript" src="./selectivizr-min.js"></script>
<![endif]-->
</head>
Selectivizrのダウンロード
2. jQuery で記述する
上記のSelectivizrを設置する場合、Webサイト内のすべてのhtmlに記述をする必要があるため、すでに大量のページがあるようなサイトでの導入はやや面倒かもしれません。
また、:last-child を使用するという事は、多くの場合［li:last-child］とするのではないでしょうか。
このような状況の時は、以下のようにちょこっとだけjQueryを記述する方法が簡単かもしれません。
記述例（html）
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Page Title</title>
<script type="text/javascript" src="./jquery.js"></script>
<script type="text/javascript" src="./sample.js"></script>
</head>
記述例（sample.js）
$(function(){
$('li:last-child').addClass('last');
});
特定の場所にだけ :last-child を使用したい時は、sample.jsの［li:last-child］部分をCSSのネストと同じようにしてあげれば良いです。
［.hoge li:last-child］こんな感じに。
余談
下記の参考サイトによると、今からおよそ1年後の2016年1月12日には、IE8のサポートが終了するとの事なので、本記事の内容はそれまでの暫定的な対応方法にはなりますが、IE8のサポートが終了したら、JavaScriptの記述を削除するだけ（2）で良いので、比較的良い方法なのでは、と思います。