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

来源:互联网 发布:淘宝快递代发 编辑:程序博客网 时间:2024/06/05 22:58
<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.









原创粉丝点击