码迷,mamicode.com
首页 > Web开发 > 详细

html5 css3表单

时间:2015-01-10 21:06:49      阅读:135      评论:0      收藏:0      [点我收藏+]

标签:html5   css3   表单   label   search   

<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
div{
margin:20px;
}
</style>
<script type="text/javascript"></script>
</HEAD>

<BODY>
	<form id="redemption" method="post">
		<hgroup>
			<h1>Oscar Redemption</h1>
			<h2>Here`s your chance to set the record straight:tell us what year the wrong film got nominated,and which film <b>should</b>have received a nod ...</h2>
		<hgroup>
		<fieldset>
		<legend>About the offending film (part 1 of 3)</legend>
		<div>
			<label for="film">The film in question?</label>
			<input id="film" name="film" type="text" placeholder="e.g.King Kong" required aria-required="true">
		</div>
		<div>
			<label for="search">Search the site...</label>
			<input id="search" name="search" type="search" placeholder="Wyat Earp" autofocus>
		</div>
		<div>
			<label for="tel">Thphone(so we berate you if you're wrong)</label>
			<input id="tel" name="tel" type="tel" placeholder="1-234-546758" autocomplete="off" required aria-required="true">
		</div>
		<div>
			<label for="awardWon">Award Won</label>
			<input id="awardWon" name="awardWon" type="text" list="awards">
			<datalist id="awards">
				<select>
					<option value="Best Picture1"></option>
					<option value="Best Picture2"></option>
					<option value="Best Picture3"></option>
					<option value="Best Picture4"></option>
				</select>
			</datalist>
		</div>
	</form>
</BODY>
</HTML>

html5 css3表单

标签:html5   css3   表单   label   search   

原文地址:http://blog.csdn.net/ztt_1119/article/details/42586775

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!