您的位置:首页 > Web前端 > HTML5

HTML5-关于如何使用<input>tags~汇总

2013-12-02 01:31 585 查看
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Popconrn Sales Form(Ajax)</title>

<style type="text/css">

img

{

position:absolute;

left:400px;

top:50px;

}

</style>

<script type="text/javascript" src="popcornA.js"></script>

</head>

<body>

<h2>Welcome to Millenium Gymnastics Booster Club Popcorn Sales</h2>

<form method="get">

<table>

<tr>

<td>Buyer's Name: </td>

<td><input type="text" name="name" size="30"></input></td>

</tr>

<tr>

<td>Street Address: </td>

<td><input type="text" name="street" size="30"></input></td>

</tr>

<tr>

<td>Zip Code: </td>

<td><input type="text" name="zip" size="10" onkeyup="getPlace(this.value)"></input></td>

</tr>

<tr>

<td>City </td>

<td><input type="text" name="city" size="30" id="city"></input></td>

</tr>

<tr>

<td>State</td>

<td><input type="text" name="state" size="30" id="name"></input></td>

</tr>

<tr>

<td>Number</td>

<td><input type="number" name="number" size="30" id="name" value="2"></input></td>

</tr>

<tr>

<td>Search</td>

<td><input type="search" name="term" id="term"></input></td>

</tr>

<tr>

<td>Range</td>

<td><input type="range" min="0" max="1" step="0.01"></input></td>

</tr>

<tr>

<td>Color</td>

<td><input type="color" name="favcolor" ></input></td>

</tr>

<tr>

<td>Date</td>

<td><input type="date" name="eventStart" id="eventstart"></input></td>

</tr>

<tr>

<td>Time</td>

<td><input type="time" name="eventTime" id="eventTime"></input></td>

</tr>

<tr>

<td>Week</td>

<td><input type="week" name="week" id="week"></input></td>

</tr>

<tr>

<td>Month</td>

<td><input type="month" name="month" id="month"></input></td>

</tr>

<tr>

<td>Local DT</td>

<td><input type="datetime-local" name="localDT" id="localDT"></input></td>

</tr>

<tr>

<td>TelPhone</td>

<td><input type="tel" name="phone" id="phone" placeholder="e.g. 000-000-0000" autocomplete="on"

pattern="[0-9]{3}[-][0-9]{3}[-][0-9]{4}" required

title="Please provide your phone number in the following format:000-000-0000"></input>

</td>

</tr>

<tr>

<td>Datalists</td>

<td><input type="text" name="coffee" list="coffees">

<datalist id="coffees">

<option value="Americano"></option>

<option value="Cappuccino"></option>

<option value="Flat White"></option>

<option value="Latte"></option>

</datalist>

</input>

</td>

</tr>

<tr>

<td>Email</td>

<td><input type="email" name="email" id="email" placeholder="e.g. joe@example.com" required></input></td>

</tr>

<tr>

<td>video</td>

<td><video src="girl.rmvb" width="300" height="225" controls poster="py.jpg"></video></td>

</tr>

</table>

<img src="popcorn.jpg" alt="picture of Popcorn" height="550px" ></img>

<p><input type="submit" value="Submit Order"></input>

<input type="reset" value="Clear Order Form"></input>

</p>

</form>

</body>

</html>

//more tag about media, please check with html 5.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: