如何在HTML中使用電子郵件輸入類型？
電子郵件是網路上的一種工具，我們可以使用電子郵件地址向他人發送正式電子郵件。有許多電子郵件服務供應商，如 Yahoo、Gmail、Hotmail 等。我們需要向這些服務提供者註冊，以便獲得自己選擇的電子郵件地址。電子郵件地址由兩部分組成－使用者名稱和網域名稱。使用者名稱可以由大寫或小寫字母、數字、特殊字元和點組成。使用者名稱的最大長度最多為 64 個字符，網域的最大長度為 253 個字符。使用者名稱和網域總是用“@”符號分隔。我們在很多地方輸入電子郵件 ID，您一定已經觀察到網頁始終接受有效地址。
在 HTML 表單中，我們建立「email」類型的單行輸入控制項。一旦使用類型郵件，它會自動檢查電子郵件地址的有效性。電子郵件地址的驗證確實非常重要，否則使用者也可能輸入錯誤的電子郵件地址。雖然它不會檢查整個電子郵件地址，但它只檢查 @ 和 TLD 擴展名，即頂級域。
讓我們了解如何在HTML中使用電子郵件。
範例
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email">
<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
在這個程式中，如果使用者沒有輸入正確的電子郵件地址格式，它將顯示錯誤訊息。
我們也可以讓我們的電子郵件控制項接受多個電子郵件地址。例如，當我們撰寫電子郵件時，我們可以在「收件者」、「副本」和「密送」欄位中鍵入多個位址。因此，如果您也想製作這樣一個允許輸入多個電子郵件地址的控件，那麼您可以使用 MULTIPLE 屬性。
範例
讓我們來看一個範例來闡明這個概念。
#<html>
<body>
<form name="form1">
<table>
<tr>
<td>
<label for="to">To </label>
</td>
<td>
<input type="email" multiple>
</td>
</tr>
<tr>
<td>
<label for="cc">Cc </label>
</td>
<td>
<input type="email" multiple>
</td>
</tr>
<tr>
<td>
<label for="bcc">Bcc </label>
</td>
<td>
<input type="email" multiple>
</td>
</tr>
<tr>
<td></td><td>
<textarea rows="10" cols="50">
</textarea></td>
</tr>
<tr>
<td></td>
<td>
<input type="submit" value="Submit"></td>
</tr>
</table>
</form>
</body>
</html>
在「收件者」或「副本」或「密件副本」欄位中，我們可以使用逗號（,）輸入多個收件者的電子郵件地址
假設在您的網站上，您想要對電子郵件地址的字元數量設定限制，那麼可以使用標籤中的MINLENGTH和MAXLENGTH屬性。 MINLENGTH將指定電子郵件地址可以接受的最小字元數，而MAXLENGTH將限制電子郵件地址中的最大字元數。
範例
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email" minlength="15" maxlength="25">
<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
輸入內容無法超出限制，一旦超過限制，遊標將停止輸入。
要設定電子郵件控制項的預設值，這表示預設電子郵件 ID 將出現在電子郵件文字欄位中（使用 VALUE 屬性），而不是空白文字欄位。您也可以使用 REQUIRED 屬性將其設為必填欄位。
範例
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email" value="abc@gmail.com" required>
<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
如果留空，將會顯示錯誤。
假設，在網站中，需要顯示可以輸入電子郵件地址的格式，以便使用者可以輕鬆地以正確的格式輸入。為此，可以建立佔位符。
範例
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email" placeholder="abc@gmail.com">
<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
最後，讓我們討論模式屬性，使用該屬性我們可以限制輸入僅特定網域的電子郵件地址。它不會接受其他網域的電子郵件地址。
範例
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email" pattern=".+@gmail\.com"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
根據這個程序，只允許使用gmail位址。
以上是如何在HTML中使用電子郵件輸入類型？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
Video Face Swap
使用我們完全免費的人工智慧換臉工具，輕鬆在任何影片中換臉！
熱門文章
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
HTML容易為初學者學習嗎？
Apr 07, 2025 am 12:11 AM
HTML適合初學者學習，因為它簡單易學且能快速看到成果。 1)HTML的學習曲線平緩，易於上手。 2)只需掌握基本標籤即可開始創建網頁。 3)靈活性高，可與CSS和JavaScript結合使用。 4)豐富的學習資源和現代工具支持學習過程。
HTML，CSS和JavaScript的角色：核心職責
Apr 08, 2025 pm 07:05 PM
HTML定義網頁結構，CSS負責樣式和佈局，JavaScript賦予動態交互。三者在網頁開發中各司其職，共同構建豐富多彩的網站。
了解HTML，CSS和JavaScript：初學者指南
Apr 12, 2025 am 12:02 AM
WebDevelovermentReliesonHtml，CSS和JavaScript：1）HTMLStructuresContent，2）CSSStyleSIT和3）JavaScriptAddSstractivity，形成thebasisofmodernWebemodernWebExexperiences。
Gitee Pages靜態網站部署失敗：單個文件404錯誤如何排查和解決？
Apr 04, 2025 pm 11:54 PM
GiteePages靜態網站部署失敗：404錯誤排查與解決在使用Gitee...
HTML中起始標籤的示例是什麼？
Apr 06, 2025 am 12:04 AM
AnexampleOfAstartingTaginHtmlis，beginSaparagraph.startingTagSareEssentialInhtmlastheyInitiateEllements，defiteTheeTheErtypes，andarecrucialforsstructuringwebpages wepages webpages andConstructingthedom。
如何用CSS3和JavaScript實現圖片點擊後周圍圖片散開並放大效果？
Apr 05, 2025 am 06:15 AM
實現圖片點擊後周圍圖片散開並放大效果許多網頁設計中，需要實現一種交互效果：點擊某張圖片，使其周圍的...
網頁批註如何實現Y軸位置的自適應佈局？
Apr 04, 2025 pm 11:30 PM
網頁批註功能的Y軸位置自適應算法本文將探討如何實現類似Word文檔的批註功能，特別是如何處理批註之間的間�...
HTML，CSS和JavaScript：Web開發人員的基本工具
Apr 09, 2025 am 12:12 AM
HTML、CSS和JavaScript是Web開發的三大支柱。 1.HTML定義網頁結構，使用標籤如、等。 2.CSS控製網頁樣式，使用選擇器和屬性如color、font-size等。 3.JavaScript實現動態效果和交互，通過事件監聽和DOM操作。
