HTML + CSSCases à cocher

Case à cocher billet composté

Un billet de train : en cochant, la pince perce un trou dans le talon et la pastille de papier tombe.

Réglages

16px
1x

Code

<label class="uvq02-tkt"><input type="checkbox"><span class="pz" aria-hidden="true"><i class="tg"></i><i class="hl"></i><i class="ch"></i></span><span class="bd"><small aria-hidden="true">MAD → LIS · 08:45</small><b>Composter le billet</b><i class="bc" aria-hidden="true"></i></span></label>

Prompt pour l’IA

Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.

Version Markdown avec tout le code, pour les assistants IA

Plus dans Cases à cocher

Voir tout : Cases à cocher

Où l’utiliser

Cette case à cocher prend la forme d'un billet de train en papier, avec un talon prédécoupé, une ligne de trajet et un petit code-barres. En la cochant, la pince perce le talon et la pastille découpée tombe en tournoyant. C'est du HTML et du CSS autour d'une vraie case, adapté au compostage de billets, au contrôle d'entrée, à l'embarquement et aux applis de voyage.

La couleur principale règle le repère de perforation et le texte validé, la secondaire donne la teinte du papier. Remplace le trajet par tes propres codes et empile plusieurs billets pour un voyage avec correspondances ou une réservation de groupe.