背景 スマホやタブレットで見ると、デフォルトのラジオボタンやチェックボックスって小さくて使い辛いですよね。そこで、ラジオボタンとチェックボックスの大きさを変更したいものの、jQueryとか画像とかは使いたくない。 ということで、CSSのみで変更する方法を試してみました。
背景 スマホやタブレットで見ると、デフォルトのラジオボタンやチェックボックスって小さくて使い辛いですよね。そこで、ラジオボタンとチェックボックスの大きさを変更したいものの、jQueryとか画像とかは使いたくない。 ということで、CSSのみで変更する方法を試してみました。
ラジオボタンを格好よくデザインする 2015年07月27日 レスポンシブにコーディングすると、スマートフォンでチェックし難いラジオボタンやチェックボックスをどうにかしたいと考える人は多いと思います。 色々な方が素晴らしいデザインを公開していますので、それを使うのも一手、ただ、オリジナルでデザインしたいと思うと、ちょっと凝りすぎているケースもちらほら。ましてそれを解説しても二番煎じなので、ここではシンプルに考える事にします。 サンプル チェックされた方の背景色を変更するだけ、というシンプルなもの。 /* ラジオボタンは非表示にする */ input[type=radio] { display: none; } /* チェックされた時のスタイル */ input[type="radio"]:checked + label { background: #0063A4; color: #FFF;
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く