ラジオボタン 縦並びのラジオボタンを作る方法【HTML/CSS・サンプルコード付き】
縦並びのラジオボタンを作る方法 縦並びのラジオボタンをHTMLとCSSだけで作る方法を紹介します。選択肢を上下に並べることで、項目数が多いフォームでも見やすく操作しやすいレイアウトになります。 アンケート、設定画面、お問い合わせフォーム、会...
ゆきのふ
ラジオボタン 
ラジオボタン 横並びのラジオボタンを作る方法【HTML/CSS・サンプルコード付き】
横並びのラジオボタンを作る方法 横並びのラジオボタンを作る方法を紹介します。複数の選択肢を横一列に配置し、その中から1つだけ選択できる基本的なフォームUIです。選択肢の数が少なく、縦方向のスペースを節約したい場合に使いやすいレイアウトです。...
チェックボックス ページを移動しても選択状態を記憶するチェックボックスの作り方【HTML/CSS/JavaScript・サンプルコード付き】
ページを移動しても選択状態を記憶するチェックボックスの作り方 ページを移動しても選択状態を記憶するチェックボックスの作り方を紹介します。このサンプルでは、HTMLで複数のチェックボックスを作成し、JavaScriptのlocalStorag...
チェックボックス 利用規約に同意すると送信できるチェックボックスを作る方法【HTML/CSS/JavaScript・サンプルコード付き】
利用規約に同意すると送信できるチェックボックスを作る方法 利用規約に同意すると送信できるチェックボックスを作る方法を紹介します。このサンプルでは、利用規約への同意チェックボックスをオンにすると送信ボタンが有効になり、チェックを外すと再び送信...
チェックボックス チェックした項目を非表示にするチェックボックスを作る方法【HTML/CSS/JavaScript・サンプルコード付き】
チェックした項目を非表示にするチェックボックスを作る方法 チェックした項目を一覧から非表示にするチェックボックスの作り方を紹介します。各項目のチェックボックスを選択すると、チェックした項目を含む行全体がすぐに非表示になります。対応済みの項目...
チェックボックス チェックした項目だけ表示するチェックボックスを作る方法【HTML/CSS/JavaScript・サンプルコード付き】
チェックした項目だけ表示するチェックボックスを作る方法 チェックした項目だけを別の一覧へ表示するチェックボックスの作り方を紹介します。項目を選択すると、その内容が選択結果エリアへ追加され、チェックを外すと一覧から自動で削除されます。現在どの...
チェックボックス チェックした件数を表示するチェックボックスを作る方法【HTML/CSS/JavaScript・サンプルコード付き】
チェックした件数を表示するチェックボックスを作る方法 チェックした件数をリアルタイムで表示するチェックボックスの作り方を紹介します。ユーザーがチェックボックスを選択・解除すると、現在選択されている件数が自動で更新されるシンプルなサンプルです...
チェックボックス 一括選択機能付きチェックボックスを作る方法【HTML/CSS/JavaScript・サンプルコード付き】
一括選択機能付きチェックボックスを作る方法 一括選択機能付きチェックボックスを作る方法を紹介します。親となる「すべて選択」チェックボックスをクリックするだけで、複数のチェックボックスをまとめて選択・解除できるシンプルなサンプルです。 設定画...
チェックボックス 横に2行で並ぶチェックボックスを作る方法【HTML/CSS・サンプルコード付き】
横に2行で並ぶチェックボックスを作る方法 横に2行で並ぶチェックボックスを作る方法を紹介します。このサンプルでは、複数のチェックボックスを横方向へ並べ、2行で見やすく表示します。HTMLとCSSだけで実装できるため、JavaScriptを使...
チェックボックス 縦に2列で並ぶチェックボックスを作る方法【HTML/CSS・サンプルコード付き】
縦に2列で並ぶチェックボックスを作る方法 縦に2列で並ぶチェックボックスを作る方法を紹介します。このサンプルでは、複数のチェックボックスを左右2列に分け、それぞれの列で上から下へ並べて表示します。HTMLとCSSだけで実装でき、JavaSc...