<style>
/* 表单元素样式重置*/
form{margin:0;} /*form与form之间由外边距的;*/
input{margin:0;padding:0;} /*input有默认的内外边距,2px边框*/
select{margin:0;} /*有2px默认的外边距,它的宽高有兼容性问题*/
textarea{
/*有内外边距*/
margin:0;
padding:0;
resize:none; /*禁止调整大小*/
overflow:auto; /*调整为内容溢出自动;*/
outline:none;} /*取消焦点框的外边框,这个是个用户体验问题*/
form{border:1px solid red;}
</style>
</head>
<body>
<form action="" method="get" target="_blank">
提交按钮:<input type="submit" value="提交" name="" />
<br/><br/>
文本框:<input type="text" name="" />
<br/><br/>
密码框:<input type="password" name="" />
<br/><br/>
单选按钮:<!-- label标签本省无实际意义,它可以关联相关标签 -->
<input type="radio" name="male" id="a" /><label for="a">男</label>
<input type="radio" name="female" id="b" /><label for="b">女</label>
<br/><br/>
<!--
checked 默认选中;
disabled 禁用状态;
-->
复选框:
<input type="checkbox" name="" disabled />篮球 <!-- name属性主要为后台使用预设的 -->
<input type="checkbox" name="" disabled />羽毛球
<input type="checkbox" name="" />逛街
<input type="checkbox" name="" />健身
<input type="checkbox" name="" />游泳
<input type="checkbox" name="" checked/>旅游
<input type="checkbox" name="" />瑜伽
<br/><br/>
<hr/><!-- 下划线 -->
文件上传:<input type="file" name="" /><!-- 原生上传文件很少使用,基本上用Flash控制 -->
<br/><br/>
图片型按钮:<input src="sun.jpg" type="image" name="" />
<br/><br/>
普通按钮(没有任何功能):<input type="button" name="" value="我是按钮" />
<br/><br/>
重置按钮:<input type="reset" name="" value="重置"/>
<br/><br/>
隐藏按钮:<input type="hidden" name="" />
<br/><br/>
<hr/>
下拉选框:
<select>
<option>1999</option>
<option>1998</option>
<option selected>1997</option>
<option>1996</option>
<option>1995</option>
</select>
<br/><br/>
文本域:<textarea>文本域</textarea>
</form>
/* 表单元素样式重置*/
form{margin:0;} /*form与form之间由外边距的;*/
input{margin:0;padding:0;} /*input有默认的内外边距,2px边框*/
select{margin:0;} /*有2px默认的外边距,它的宽高有兼容性问题*/
textarea{
/*有内外边距*/
margin:0;
padding:0;
resize:none; /*禁止调整大小*/
overflow:auto; /*调整为内容溢出自动;*/
outline:none;} /*取消焦点框的外边框,这个是个用户体验问题*/
form{border:1px solid red;}
</style>
</head>
<body>
<form action="" method="get" target="_blank">
提交按钮:<input type="submit" value="提交" name="" />
<br/><br/>
文本框:<input type="text" name="" />
<br/><br/>
密码框:<input type="password" name="" />
<br/><br/>
单选按钮:<!-- label标签本省无实际意义,它可以关联相关标签 -->
<input type="radio" name="male" id="a" /><label for="a">男</label>
<input type="radio" name="female" id="b" /><label for="b">女</label>
<br/><br/>
<!--
checked 默认选中;
disabled 禁用状态;
-->
复选框:
<input type="checkbox" name="" disabled />篮球 <!-- name属性主要为后台使用预设的 -->
<input type="checkbox" name="" disabled />羽毛球
<input type="checkbox" name="" />逛街
<input type="checkbox" name="" />健身
<input type="checkbox" name="" />游泳
<input type="checkbox" name="" checked/>旅游
<input type="checkbox" name="" />瑜伽
<br/><br/>
<hr/><!-- 下划线 -->
文件上传:<input type="file" name="" /><!-- 原生上传文件很少使用,基本上用Flash控制 -->
<br/><br/>
图片型按钮:<input src="sun.jpg" type="image" name="" />
<br/><br/>
普通按钮(没有任何功能):<input type="button" name="" value="我是按钮" />
<br/><br/>
重置按钮:<input type="reset" name="" value="重置"/>
<br/><br/>
隐藏按钮:<input type="hidden" name="" />
<br/><br/>
<hr/>
下拉选框:
<select>
<option>1999</option>
<option>1998</option>
<option selected>1997</option>
<option>1996</option>
<option>1995</option>
</select>
<br/><br/>
文本域:<textarea>文本域</textarea>
</form>