セレクトボックス 複数選択できるセレクトボックスを作る方法【HTML/CSS/JavaScript・サンプルコード付き】
複数選択できるセレクトボックスを作る方法 複数選択できるセレクトボックスを作る方法を紹介します。通常のセレクトボックスは1つの項目だけを選択しますが、HTMLのmultiple属性を使用すると、複数の選択肢を同時に選べるリスト形式のセレクト...
ゆきのふ
セレクトボックス 
セレクトボックス 項目をグループ分けしたセレクトボックスを作る方法【HTML/CSS・サンプルコード付き】
項目をグループ分けしたセレクトボックスを作る方法 項目をグループ分けしたセレクトボックスを作る方法を紹介します。このサンプルではHTMLのoptgroup要素を利用し、関連する選択肢をカテゴリごとにまとめて表示できます。選択肢が多いフォーム...
セレクトボックス セレクトボックスで選択できない項目を設定する方法【HTML/CSS・サンプルコード付き】
セレクトボックスで選択できない項目を設定する方法 セレクトボックスで選択できない項目を設定する方法を紹介します。このサンプルではHTMLとCSSだけを使用し、一部の選択肢だけを選択できない状態に設定する方法を実装しています。通常の選択肢はそ...
セレクトボックス 最初から項目が選択されたセレクトボックスを作る方法【HTML/CSS・サンプルコード付き】
最初から項目が選択されたセレクトボックスを作る方法 最初から項目が選択されたセレクトボックスを作る方法を紹介します。このサンプルでは、HTMLのselected属性を使用して、ページを開いた時点で任意の項目を初期選択した状態で表示します。利...
php ラジオボタンを必須入力にする方法【HTML/CSS/JavaScript・サンプルコード付き】
ラジオボタンを必須入力にする方法 ラジオボタンを必須入力にする方法を紹介します。複数の選択肢を用意したフォームでは、ユーザーが何も選ばないまま送信してしまうことがあります。このサンプルでは、送信ボタンを押した時点でラジオボタンの選択状態を確...
ラジオボタン 選択できないラジオボタンを作る方法【HTML/CSS・サンプルコード付き】
選択できないラジオボタンを作る方法 選択できないラジオボタンを作る方法を紹介します。ラジオボタンへdisabled属性を設定すると、その項目はクリックしても選択できなくなります。利用できないプランや在庫切れの商品、条件を満たしていない選択肢...
ラジオボタン ホバーで反応するラジオボタンを作る方法【HTML/CSS・サンプルコード付き】
ホバーで反応するラジオボタンを作る方法 ホバーで反応するラジオボタンを作る方法を紹介します。ラジオボタンへマウスカーソルを重ねたときに背景色や枠線などが変化することで、クリックできる項目であることを視覚的に分かりやすく伝えられます。お問い合...
ラジオボタン 選択中を強調表示するラジオボタンを作る方法【HTML/CSS・サンプルコード付き】
選択中を強調表示するラジオボタンを作る方法 選択中の項目を強調表示するラジオボタンをHTMLとCSSで作る方法を紹介します。このサンプルでは、「HTML」「CSS」「JavaScript」「PHP」の4つの選択肢を用意し、選択した項目だけ背...
ラジオボタン 最初から項目が選択されたラジオボタンを作る方法【HTML/CSS・サンプルコード付き】
最初から項目が選択されたラジオボタンを作る方法 最初から項目が選択されたラジオボタンを作る方法を紹介します。このサンプルでは、HTMLのchecked属性を使用して、ページを開いた時点であらかじめ1つの選択肢を選択した状態に設定します。利用...
ラジオボタン 画像をラジオボタンにする方法【HTML/CSS・サンプルコード付き】
画像をラジオボタンにする方法 画像をラジオボタンにする方法を紹介します。このサンプルでは、通常のラジオボタンの代わりに画像を選択肢として表示し、画像をクリックして1つを選べるUIをHTMLとCSSで作成します。選択した画像には青い枠線とチェ...