HTML5_html5 チュートリアルスキルの 8 つの新しい INPUT 入力タイプの紹介-H5 チュートリアル-php.cn

ホームページ

ウェブフロントエンド

H5 チュートリアル

HTML5_html5 チュートリアルスキルの 8 つの新しい INPUT 入力タイプの紹介

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 03:46 PM

html5新しい

既存の入力タイプの HTML コードの例:

コードをコピーします

コードは次のとおりです:

テキストフィールド
ラジオボタン
チェックボックス
ドロップダウンリスト

HTML5 では、複数の新しいフォーム入力入力タイプが追加されており、これらの新しい要素を使用することで、より優れた入力制御と検証を有効にすることができます。
1. 電子メールタイプのアプリケーション
電子メールタイプの入力要素は、フォームを送信するときに、電子メールの入力値が自動的に検証されるテキスト入力ボックスです。箱の。

コードをコピー

コードは次のとおりです:

2. URL タイプの適用
url タイプの input 要素は、URL アドレスなどの特殊なテキストを入力するためのテキストボックスを提供します。

コードをコピー

コードは次のとおりです:

3. 数値型の適用
数値型入力要素は、数値を入力するためのテキストボックスを提供します。

コードをコピー

コードは次のとおりです:

4. 範囲型の応用
範囲型のinput要素は、Webページ上にスクロールバーとして表示される、一定の範囲内の数値を入力するためのテキストボックスを提供します。。

コードをコピー

コードは次のとおりです:

5. 日付チェックアウト型アプリケーション
入力タイプ HTML コード機能説明

コードをコピー

コードは次のとおりです。

日付

日、月、年を選択
月
月と年を選択

コードをコピー

コードは次のとおりです。

週

週と年を選択

コードをコピー

コードは次のとおりです:

time

時間を選択 (時と分)

コードをコピー

コードは次のとおりです:

datetime < ;input type="datetime">

時間、日、月、年 (UTC 時間) を選択

コードをコピー

コードは次のとおりです:

datetime-local
時刻、日、月、年を選択します。時間)

6. 検索系アプリケーション

検索タイプの入力要素には、検索キーワードを入力するためのテキストボックスが表示されます。

コードをコピーします

コードは次のとおりです:

input[type="search"]{
-webkit-Appearance:textfield;
}

7. Tel タイプのアプリケーション
tel タイプの入力要素は、電話番号を入力するための専用のテキストボックスを提供します。

コードをコピー

コードは次のとおりです:

8. カラータイプアプリケーション
カラータイプ入力要素は、カラーを設定するために特別に使用されるテキストボックスを提供します。

コードをコピー

コードは次のとおりです:

声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

html5的div一行可以放两个吗Apr 25, 2022 pm 05:32 PM

html5的div元素默认一行不可以放两个。div是一个块级元素，一个元素会独占一行，两个div默认无法在同一行显示；但可以通过给div元素添加“display：inline;”样式，将其转为行内元素，就可以实现多个div在同一行显示了。

html5中列表和表格的区别是什么Apr 28, 2022 pm 01:58 PM

html5中列表和表格的区别：1、表格主要是用于显示数据的，而列表主要是用于给数据进行布局；2、表格是使用table标签配合tr、td、th等标签进行定义的，列表是利用li标签配合ol、ul等标签进行定义的。

html5怎么让头和尾固定不动Apr 25, 2022 pm 02:30 PM

固定方法：1、使用header标签定义文档头部内容，并添加“position:fixed;top:0;”样式让其固定不动；2、使用footer标签定义尾部内容，并添加“position: fixed;bottom: 0;”样式让其固定不动。

HTML5中画布标签是什么May 18, 2022 pm 04:55 PM

HTML5中画布标签是“<canvas>”。canvas标签用于图形的绘制，它只是一个矩形的图形容器，绘制图形必须通过脚本（通常是JavaScript）来完成；开发者可利用多种js方法来在canvas中绘制路径、盒、圆、字符以及添加图像等。

html5中不支持的标签有哪些Mar 17, 2022 pm 05:43 PM

html5中不支持的标签有：1、acronym，用于定义首字母缩写，可用abbr替代；2、basefont，可利用css样式替代；3、applet，可用object替代；4、dir，定义目录列表，可用ul替代；5、big，定义大号文本等等。

html5废弃了哪个列表标签Jun 01, 2022 pm 06:32 PM

html5废弃了dir列表标签。dir标签被用来定义目录列表，一般和li标签配合使用，在dir标签对中通过li标签来设置列表项，语法“<dir><li>列表项值</li>...</dir>”。HTML5已经不支持dir，可使用ul标签取代。

html5是什么意思Apr 26, 2021 pm 03:02 PM

html5是指超文本标记语言（HTML）的第五次重大修改，即第5代HTML。HTML5是Web中核心语言HTML的规范，用户使用任何手段进行网页浏览时看到的内容原本都是HTML格式的，在浏览器中通过一些技术处理将其转换成为了可识别的信息。HTML5由不同的技术构成，其在互联网中得到了非常广泛的应用，提供更多增强网络应用的标准机。

html5为什么只需要写doctypeJun 07, 2022 pm 05:15 PM

因为html5不基于SGML（标准通用置标语言），不需要对DTD进行引用，但是需要doctype来规范浏览器的行为，也即按照正常的方式来运行，因此html5只需要写doctype即可。“!DOCTYPE”是一种标准通用标记语言的文档类型声明，用于告诉浏览器编写页面所用的标记的版本。

See all articles

ホットAIツール

ホットツール

SecLists は、セキュリティテスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティテスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティテストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジングペイロード、機密データパターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテストマシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。

Safe Exam Browser

Safe Exam Browser は、オンライン試験を安全に受験するための安全なブラウザ環境です。このソフトウェアは、あらゆるコンピュータを安全なワークステーションに変えます。あらゆるユーティリティへのアクセスを制御し、学生が無許可のリソースを使用するのを防ぎます。

EditPlus 中国語クラック版

サイズが小さく、構文の強調表示、コードプロンプト機能はサポートされていません

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。