2018-05-02 10:46:21 1350瀏覽
HTML5 新表單類型示例代碼有不少對(duì)HTML5開發(fā)感興趣的小伙伴不是很了解，本篇文章小編就不多說(shuō)廢話了，帶大家一塊來(lái)看一下扣丁學(xué)堂HTML5在線學(xué)習(xí)分享的HTML5 新表單類型示例代碼，?？梢詭偷綄?duì)HTML5感興趣的小伙伴們。
demo.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
form {
width: 100%;
max-width: 640px;
min-width: 320px;
margin: 0 auto;
font-family: "Microsoft Yahei";
font-size: 20px;
}
input {
display: block;
width: 100%;
height: 30px;
margin: 10px 0;
}
</style>
</head>
<body>
<form action="">
<fieldset>
<legend>表單屬性</legend>
<label for="">
email: <input type="email" name="email" >
</label>
<label for="">
tel: <input type="tel" name="tel" > <!-- 本身不驗(yàn)證,自己添加驗(yàn)證 -->
</label>
<label for="">
url: <input type="url" name="url" >
</label>
<label for="">
number: <input type="number" name="number" step="5"> <!--輸入的是步長(zhǎng)的整倍數(shù)-->
</label>
<label for="">
search: <input type="search" name="search" > <!--移動(dòng)端出現(xiàn)的小鍵盤右下角是搜索按鈕-->
</label>
<label for="">
range: <input type="range" name="range" value="100" min="0" max="300"> <!--默認(rèn)最小0 最大100-->
</label>
<label for="">
<label for="">
color: <input type="color" name="color" >
</label>
time: <input type="time" name="time" >
</label>
<label for="">
date: <input type="date" name="date" >
</label>
<label for="">
month: <input type="month" name="month" >
</label>
<label for="">
week: <input type="week" name="week" >
</label>
<label for="">
datetime: <input type="datetime" name="datetime" >
</label>
<input type="submit" value="提交">
</fieldset>
</form>
</body>
</html>
以上就是小編分享的HTML5新表單類型示例代碼，希望可以幫到小伙伴們。對(duì)HTML5感興趣想要學(xué)習(xí)的小伙伴可以選擇扣丁學(xué)堂學(xué)習(xí)，扣丁學(xué)堂HTML5培訓(xùn)是專業(yè)的HTML5培訓(xùn)機(jī)構(gòu)，不僅有專業(yè)的老師和與時(shí)俱進(jìn)的課程體系，還有大量的HTML5在線教程供學(xué)員觀看學(xué)習(xí)哦?？鄱W(xué)堂H5技術(shù)交流群：559883758。
【關(guān)注微信公眾號(hào)獲取更多學(xué)習(xí)資料】
查看更多關(guān)于“HTML5開發(fā)技術(shù)資訊”的相關(guān)文章>>
全國(guó)免費(fèi)咨詢熱線
郵箱：codingke@1000phone.com
官方群：148715490
返回頂部