HTML5教學 - HTML5 表單 2.0

HTML5教學 - HTML5 事件

HTML5 表單 2.0

Web 表單 2.0 是 HTML4 表單特性的一個擴充。 HTML5 中的表單元素和屬性相比 HTML4 提供了更大程度的語意標記，移除了大量 HTML4 中所需的繁瑣腳本和樣式。

HTML4 中的 元素

HTML4 輸入框元素使用 type 屬性指定資料類型。 HTML4 提供了下列類型：

下面是一個使用標註標籤，單選按鈕以及提交按鈕的簡單示例：

HTML5 中的 元素

HTML5 中的 元素

給輸入框元素的type 屬性引入了幾個新值。如下表所列。

注意： 請使用最新版的 Opera 瀏覽器來執行以下所有範例。

元素

HTML5 也引入了一個新元素

，用來表示不同類型的輸出結果，例如輸出由腳本所寫。

也可以用 for 屬性指定輸出元素和文件中影響計算的其他元素之間的關係（例如，作為輸入來源或參數）。 for 屬性的值是一個由空格分隔的其他元素的 IDs 清單。

DEMO：http://www.tutorialspoint.com/cgi-bin/practice.cgi?file=html5-11.htm

placeholder 屬性

HTML5 引入了一個稱為 palceholder 的新屬性。這個屬性在 和 元素上為使用者提供了在這個欄位可以輸入什麼的提示。佔位符字元不能包含回車符或換行符。 <p style="max-width:90%" helvetica neue sc sans gb yahei sans-serif font-size: white-space: normal background-color: rgb box-sizing: border-box word-wrap: break-word></p>下面是placeholder 屬性的簡單語法：<p style="margin-top: 0px; margin-bottom: 0px; padding: 0px; max-width: 100%; clear: both; min-height: 1em; color: rgb(62, 62, 62); font-family: -apple-system-font, " helvetica neue sc sans gb yahei sans-serif font-size: white-space: normal background-color: rgb box-sizing: border-box word-wrap: break-word><span style="margin: 0px; padding: 0px; max-width: 100%; box-sizing: border-box !important; word-wrap: break-word !important; border: 0px; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-weight: 700; line-height: inherit; vertical-align: baseline;"></span>下面是placeholder 屬性的簡單語法：</p> <p style="margin-top: 0px; margin-bottom: 0px; padding: 0px; max-width: 100%; clear: both; min-height: 1em; color: rgb(62, 62, 62); font-family: -apple-system-font, " helvetica neue sc sans gb yahei sans-serif font-size: white-space: normal background-color: rgb box-sizing: border-box word-wrap: break-word></p>下面是placeholder 屬性的簡單語法：<p><img src="https://img.php.cn//upload/image/374/263/331/1486445391374331.jpg" title="1486445391374331.jpg" alt="HTML5教學 - HTML5 表單 2.0"></p>下面是placeholder 屬性的簡單語法：<p style="max-width:90%" helvetica neue sc sans gb yahei sans-serif font-size: white-space: normal background-color: rgb box-sizing: border-box word-wrap: break-word></p> <p>下面是placeholder 屬性的簡單語法：</p> <p><br>下面是placeholder 屬性的簡單語法：</p>🎜🎜🎜🎜DEMO：http://www.tutorialspoint.com/cgi-bin/practice.cgi?file=html5-56.htm🎜🎜🎜現在，我們不需要使用JavaScript 處理諸如空文本框永遠不能被提交的這類客戶端驗證了，因為HTML5 引入了一個叫做required 的新屬性，可以按照如下方式使用，它會保證輸入框有值：🎜 🎜🎜🎜🎜DEMO：http://www.tutorialspoint.com/cgi-bin/practice.cgi?file=html5-57.htm🎜🎜以上就是HTML5教學- HTML5 表單2.0的內容，更多相關內容請追蹤PHP中文網（www.php.cn）！ 🎜🎜🎜🎜