課題
Webページ上のすべての要素に対して、デザイナーはコントロール し
たがるものです。 CSS を扱った経験の乏しいグラフィックデザイナーが
Web サイトのモックアップを作ると、カスタマイズされたフォームの要
素を作りがちです。そして、CSSを作成する開発者が頭を抱えることにな
ります。
CSSが生まれたころには、フォームへのスタイル設定の機能はとても少
なく、CSS関連のさまざまな仕様の中でも明確には定義されていませんで
した。しかしその後数年の間に、フォームのウィジェットに対して設定可
能なCSSのプロパティが大幅に増加し、ほとんどの要素を詳細にカスタマ
イズできるようになりました。
しかし、チェックボックスはこの恩恵をあまり受けていません。今日で
も、ほとんどのブラウザではこれらへのスタイル設定をほとんど行えませ
ん。その結果、開発者はデフォルトのスタイルを受け入れるか、 divと
JavaScriptを使ってチェックボックスを作りなおすといった不愉快でアク
セシビリティもないハックに頼るかという選択を迫られています。
このような制約を受けずに、チェックボックスのスタイルをカスタマイ
ズする方法はないのでしょうか。もちろん、コードの肥大化は避けなけれ
ばならず、要素本来の意味やアクセシビリティが損なわれることがあって
はなりません。
チェックボックスの
カスタマイズ
31