この記事では、HTMLでoptionタグを使用する方法を紹介します。これは、リストにオプションを作成するためのselectタグに付属するタグです。

optionタグは、 <select>タグのオプションのリストにオプションを作成します。

<select>または<datalist>タグペア内で<option>タグを使用します。

注：

• < optton>タグは、属性なしで使用できます。ただし、選択したデータをサーバーに送信する場合は、value属性を使用する必要があります。
• オプションが多すぎる場合は、<optgroup>タグを使用できます。

1.HTMLでオプションタグを使用する方法

例：optionを使用して、web888.vnのコースのリストにオプションを作成します。

 <select> <option>PHP</option> <option>Javascript</option> <option>HTML-CSS</option> <option>Database</option> <option>Lập trình mobile</option> </select>

各コースは<option>タグのペアにあり、オプションを選択すると、そのオプションの値は<select>タグの値になります。

2.HTMLのオプションタグの属性

これは、selectタグで一般的に使用される属性です。

• 無効-オプションを無効にします。オプションは引き続き表示されますが、ユーザーが選択することはできません。
• label-オプションの短いラベルを設定します。
• selected-オプションにこの属性がある場合、ページの読み込み後に選択されるデフォルト値になります。
• value-オプションの値。また、そのオプションが選択されている場合はselectの値。

たとえば、オプションタグの値と選択された属性を使用します。送信されると、selectの値を警告します。

 <form> <select id="select"> <option value="php">PHP</option> <option value="js">Javascript</option> <option value="html/css" selected="selected">HTML-CSS</option> <option value="db">Database</option> <option value="mobile">Lập trình mobile</option> </select> <input type="submit" name="Submit" onclick='alert(document.getElementById("select").value)'> </form>

3.htmlのCSSを追加します。オプションタグ

オプションタグにCSSを使用することはめったにありません。ただし、スタイルを設定する場合は、次を使用します。

 option{ color:red }

または、ID /クラスを設定してから、セレクタークエリを使用します。