HTML5 に追加される新しい入力コントロールのタイプ

青灯夜游
リリース: 2022-05-30 15:34:31
オリジナル
6980 人が閲覧しました

13 の新しいタイプを追加しました: 1. カラー、カラー ピッカー コントロール; 2. 日付、日付コントロール (年、月、日を含むが時間は含まれません); 3. 電話番号、電話番号コントロール; 4. 時間、時刻制御 (タイムゾーンなし); 5. "datetime-local"、日付と時刻の制御; 6. 検索、検索制御など。

HTML5 に追加される新しい入力コントロールのタイプ

このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

<input> タグは、ユーザーがデータを入力できる入力フィールドを指定します。この要素は、ユーザーがデータを入力できる入力コントロールを宣言するために

要素で使用されます。

type 属性は、表示される <input> 要素のタイプを指定します。

#HTML5 の新しい入力コントロール タイプ (type 属性値)

ValueDescriptioncolorカラーピッカーを定義します。 date日付コントロールを定義します (年、月、日を含み、時間を除く)。 datetime日付と時刻のコントロールを定義します (UTC タイム ゾーンに基づいて、年、月、日、時、分、秒、秒の小数部を含む)。 datetime-local日付と時刻のコントロールを定義します (年、月、日、時、分、秒、秒の小数部、タイム ゾーンなしを含む)。 email 電子メール アドレスに使用されるフィールドを定義します。 month月と年のコントロールを定義します (タイムゾーンなし)。 number 数値を入力するフィールドを定義します。 #range正確な値が重要ではない数値を入力するためのコントロール (スライダー コントロールなど) を定義します。 search検索文字列の入力に使用するテキスト フィールドを定義します。 tel 電話番号を入力するフィールドを定義します。 time 時刻を入力するためのコントロールを定義します (タイムゾーンなし)。 urlURL を入力するフィールドを定義します。 week週と年のコントロールを定義します (タイムゾーンなし)。

タイプは以下に紹介されています:

  • color

HTML5 に追加される新しい入力コントロールのタイプ## クリックするとカラーセレクターがポップアップ表示され、次のことができます。任意の色を選択してください

  • 数値


    HTML5 に追加される新しい入力コントロールのタイプ 範囲内の数値を入力してください。範囲外の数値を手動で入力することはできますが、送信することはできません

  • tel

    電話番号を入力してください、safari のみサポートしています

  • email

    検出機能が組み込まれています。 @ 記号が含まれているかどうか、および @ 記号の前後に文字 ## があるかどうかを検出します。 ##url
    入力した URL は http:// で始まり、その後に文字が続く必要があります。それ以外の場合は送信できません。

  • search
    HTML5 に追加される新しい入力コントロールのタイプテキストを定義してください検索文字列を入力するために使用されるフィールド

  • #Date control- date

  • <input>
    ログイン後にコピー
    ログイン後にコピー
    ログイン後にコピー
    ログイン後にコピー
    ログイン後にコピー
    ログイン後にコピー


    時間制御- time

HTML5 に追加される新しい入力コントロールのタイプ

<input>
<input>
ログイン後にコピー
  • 日時制御-datetime- local

HTML5 に追加される新しい入力コントロールのタイプ

<input>
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

2-HTML5 に追加される新しい入力コントロールのタイプ

月管理- month
  • ##
<input>
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

HTML5 に追加される新しい入力コントロールのタイプ週の制御 - 週

<input>
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

HTML5 に追加される新しい入力コントロールのタイプ日付時間の制御 - datetime

  • <input>
    ログイン後にコピー
    ログイン後にコピー
    ログイン後にコピー
    ログイン後にコピー
    ログイン後にコピー
    ログイン後にコピー
  • 説明: 日付 時間コントロールは、設定可能な最小時間と最大時間を示す min 属性と max 属性もサポートしています

HTML5 に追加される新しい入力コントロールのタイプ

<input>
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
    関連する推奨事項: 「
  • html ビデオ チュートリアル

以上がHTML5 に追加される新しい入力コントロールのタイプの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート