关于HTML / CSS中的表单几乎没有什么

Question

我有一张表格。我尝试使用CSS更改复选框和单选按钮的样式，但没有运气。最后我发现了一些似乎正在运行的JS代码。它改变了复选框的样式，但不会改变单选按钮的样式。此外，复选框标签的位置不会分配复选框。

JS代码：

$(function() {

    $('input[type=checkbox]').each(function() {
        var span = $('<span class="' + $(this).attr('type') + ' ' + $(this).attr('class') + '"></span>').click(doCheck).mousedown(doDown).mouseup(doUp);
        if ($(this).is(':checked')) {
            span.addClass('checked');
        }
        $(this).wrap(span).hide();
    });

    function doCheck() {
        if ($(this).hasClass('checked')) {
            $(this).removeClass('checked');
            $(this).children().prop("checked", false);
        } else {
            $(this).addClass('checked');
            $(this).children().prop("checked", true);
        }
    }

    function doDown() {
        $(this).addClass('clicked');
    }

    function doUp() {
        $(this).removeClass('clicked');
    }
});

它似乎在jsfiddle中并不完美，但是：http://jsfiddle.net/Sgn6n/1/

这是我基于代码的代码：http://jsfiddle.net/jtbowden/xP2Ns/