Bootstrapでラジオボタンを作成する方法

まず、以下の手順に従ってBootstrapをプロジェクトに追加します。

Bootstrapの公式ウェブサイト(https://getbootstrap.com/)にアクセスします。
ダウンロードページから最新バージョンのBootstrapをダウンロードします。
ダウンロードしたファイルを解凍し、プロジェクトの適切な場所に配置します。

次に、以下のHTMLコードを使用して基本的なラジオボタンを作成します。

<div class="form-check">
  <input class="form-check-input" type="radio" name="exampleRadios" id="radio1" value="option1" checked>
  <label class="form-check-label" for="radio1">
    Option 1
  </label>
</div>
<div class="form-check">
  <input class="form-check-input" type="radio" name="exampleRadios" id="radio2" value="option2">
  <label class="form-check-label" for="radio2">
    Option 2
  </label>
</div>

上記のコードでは、form-checkクラスを使用してラジオボタンのコンテナを作成し、form-check-inputクラスを使用して実際のラジオボタンを作成しています。name属性を同じ値に設定することで、グループ内で互いに排他的な選択肢を作成します。checked属性を使用すると、初期状態で選択されたラジオボタンを指定できます。

この基本的なコードをカスタマイズして、必要に応じてスタイルやレイアウトを変更することもできます。また、JavaScriptを使用してラジオボタンの値を取得したり、イベントを処理したりすることもできます。

以上が、Bootstrapを使用してラジオボタンを作成する方法の基本的な手順です。必要に応じて、さらに高度な機能を追加することもできます。この方法を利用して、シンプルで使いやすいラジオボタンを作成してみてください。