HTMLでデフォルト値を設定する方法

HTML はハイパーテキスト マークアップ言語であり、Web ページの作成に使用される基本言語です。 Web ページには通常、HTML、CSS、JavaScript の 3 つの言語が含まれています。その中でも HTML は最も基本的な言語であり、Web ページのテキスト内容、構造、レイアウトを記述するために使用されます。

Web ページをデザインするとき、入力ボックス、ドロップダウン ボックス、ラジオ ボタン、チェック ボックスなどの一部のコントロールのデフォルト値を設定する必要がある場合があります。これらのコントロールのデフォルト値は、ユーザーが Web ページにアクセスしたときにこれらのコントロールによって表示される値です。デフォルト値が設定されていない場合、これらのコントロールは通常空白です。

それでは、HTML でコントロールのデフォルト値を設定するにはどうすればよいでしょうか?次に、一緒に調べてみましょう。

1. HTML での入力ボックスのデフォルト値の設定

HTML では、 タグに value 属性を設定することで、入力ボックスのデフォルト値を設定できます。例:

<input type="text" name="username" value="admin">

上記のコードでは、name 属性は入力ボックスの名前が「username」であることを示し、value 属性は入力ボックスのデフォルト値が「admin」であることを示します。

2. HTML でのドロップダウン ボックスのデフォルト値の設定

HTML では、< で selected 属性を設定することで、ドロップダウン ボックスのデフォルト値を設定できます。タグを選択します。例:

<select name="fruit">
    <option value="apple" selected>Apple</option>
    <option value="banana">Banana</option>
    <option value="orange">Orange</option>
</select></p>
<p>上記のコードでは、最初の <option> タグには selected 属性が設定されており、デフォルトで「Apple」オプションが選択されていることを示しています。 </p>
<p>3. HTML でのラジオ ボタンとチェック ボックスのデフォルト値の設定</p>
<p>ラジオ ボタンとチェック ボックスのデフォルト値は、&lt に selected 属性を設定することで設定できます。 ;input> タグを満たす必要があります。例: </p>
<pre class="brush:php;toolbar:false"><input type="radio" name="gender" value="male" checked> Male
<input type="radio" name="gender" value="female"> Female

<input type="checkbox" name="hobby" value="reading" checked> Reading
<input type="checkbox" name="hobby" value="traveling" checked> Traveling
<input type="checkbox" name="hobby" value="sports"> Sports

上記のコードでは、最初のラジオ ボタンと最初の 2 つのチェック ボックスには、デフォルトで選択されていることを示す、checked 属性が設定されています。ラジオ ボタンとチェック ボックスの名前属性は同じである必要があることに注意してください。そうでない場合、それらは同じオプション グループに属しません。

4. HTML でのテキスト領域のデフォルト値の設定

テキスト領域は複数行の入力ボックスであり、そのデフォルト値は < にテキストの内容を設定することで実現できます。 ;textarea>タグ。例:

<textarea name="description">This is a description.</textarea>

上記のコードでは、テキスト フィールドのデフォルト値は「これは説明です。」です。

概要

上記の方法により、HTML でコントロールのデフォルト値を設定できるため、ユーザーが Web ページにアクセスすると、これらのコントロールにはデフォルトで設定した値が表示されます。 。これにより、ユーザーが使いやすくなり、ユーザー エクスペリエンスが向上します。

デフォルト値の設定は、ユーザーがこれらの値を入力する必要があることを意味するものではなく、ユーザーはこれらのコントロールの値を自由に変更できることに注意してください。

以上がHTMLでデフォルト値を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。