2018年07月18日(水)

任意のテキストでチェックボックス

• 0
• 1
• 4
• 8

Result

See the Pen Text Only Checkboxes by kachibito (@kachibito) on CodePen.

任意のテキストとか任意のスタイルでオリジナルなチェックボックスを作れます

css

.text-checkbox { display: block; } .text-checkbox input { display: none; } .text-checkbox span { font-family: monospace; } .text-checkbox .checked { display: none; } .text-checkbox :checked ~ .checked { display: inline-block; } .text-checkbox :checked ~ .unchecked { display: none; }

html

hoge...