codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="it" xml:lang="it">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>cards</title>

        <style type="text/css">
        #hands fieldset {
            height      : auto;
            overflow    : hidden;
            border      : 0;
            margin      : 0;
            width       : 380px;
        }

        #hands label {
            display     : inline;
            width       : 180px;
            height      : 252px;
            line-height : 1000px;
            text-align  : right;
            cursor       : pointer;
            border      : 1px #cfcfd2 solid;
        }

            #hands .card1 { float  : right; }
            #hands .card2 { float  : left; }


        label.card input {
        }

        /* 10 di quadri */
        #q10 {
            background: url(http://upload.wikimedia.org/wikipedi...-sm-235-Td.png) top left no-repeat;
        }

        /* J di fiori */
        #fj {
            background: url(http://upload.wikimedia.org/wikipedi...-sm-244-Jc.png) top left no-repeat;
        }

        </style>

    </head>

<body>

    <form id="hands">
    ...        

        <fieldset>

            <label for="player3_card2" id="fj" class="card2">
                <input type="checkbox" name="p3_2" id="player3_card2" /></label>

            <label for="player3_card1" id="q10" class="card1">
                <input type="checkbox" name="p3_1" id="player3_card1" /></label>

        </fieldset>

    ...
    
        

La carta #1 è quella più a destra</p>

        <input type="submit" value="invia carte" />
    </form>
</body>
</html>
copia e incolla
l'esempio però non è ottimizzato: sarebbe indicato avere un'unica immagine (una sprite) contenente tutte le carte (che non avevo) e poi settare il background-position per ciascuna carta in modo da caricare una sola immagine anziché 52 immagini distinte.

se vuoi visualizzare la checkbox basta eliminare il line-height dallo stile.

provalo con un po' di browser che ti servono per vedere se funziona ovunque. (forse su qualche vecchia versione di safari non funzionerà)