なんて言ったらいいかわかりませんが、複数のチェックボックスのうち、1つ以上チェックが入っていて、全部にはチェックが入っていないような中途半端な状態を表すチェックボックスを作る方法です。
画像もcssもいりません。Javascriptで実装できます。

# 正確にはindeterminate（不確定）な状態だそうです。

サンプル

下手な説明よりは実際に動くサンプルをご覧ください。
サンプルは以下。

ソースコード

htmlとjavascriptのコードはこちら

<ul>
    <li><label><input type="checkbox" id="checkAll"> すべてにチェックをする</label></li>
    <li><ul id="checkboxArea">
        <li><label><input type="checkbox"> アイテム１</label></li>
        <li><label><input type="checkbox" checked> アイテム２</label></li>
        <li><label><input type="checkbox"> アイテム３</label></li>
    </ul></li>
</ul>

<script>
jQuery(document).ready(function(){
    jQuery("#checkboxArea").click(function () {
        var checkboxCount = jQuery("#checkboxArea input[type=checkbox]").length;
        var selectedCount = jQuery("#checkboxArea input[type=checkbox]:checked").length;
        if (checkboxCount === selectedCount) {
            jQuery("#checkAll").prop("indeterminate", false).prop("checked", true );
        } else if (0 === selectedCount) {
            jQuery("#checkAll").prop("indeterminate", false).prop("checked", false);
        } else {
            jQuery("#checkAll").prop("indeterminate", true ).prop("checked", false);
        }
    }).click();
    jQuery("#checkAll").click(function () {
        var checked = jQuery("#checkAll").prop("checked");
        jQuery("#checkboxArea input[type=checkbox]").each(function(){
            jQuery(this).prop("checked", checked);
        });
    });
});
</script>

jQuery("#checkAll").prop("indeterminate", true);これで中途半端な状態になるようです。
これはhtmlの属性に書いてもダメで、javascriptで指定しないといけないようです。
POSTされるかどうかはcheckedによって決まるようです。