HTML表格与表单知识

<!--表格-->
<!--border设置表格线条大小,align设表格或行或列对其方式(水平),bordercolor是设置边框颜
色,bgcolor 背景色;background表格背景图片-->
<!--cellpadding设单元格文字与单元格距离;cellspacing设单元格间距-->
<table border="1" cellpadding="5" cellspacing="5"  bordercolar="red" background="aa.jpg" 
widtn="200"  bgcolor="yellow" align="center" height="100">
<tr>
<!--colspan跨列合并表格-->
  <td  >好</td>
  <td colspan="2" >大家好</td>
</tr>
<tr >
<!--rowspan跨行合并表格-->
  <td rowspan="2">老师</td>
  <td>小明</td>
  <td>小红</td>
</tr>
<tr>
  <td>小刚</td>
  <td>小路</td>
</tr>

</table>


<!--表单-->

<body>

<!--method 默认有post或get; action设跳转页面;enctype设置上传编码格式-->
<form method="post" action="div.html" enctype="multipart/form-data">
<!--域-->
<fieldset>
<!--域标题-->
<legend>基本信息</legend>
<!--size设大小;maxlength设限制内容多少;name设前后交互使用;placeholder设表单提示内
容;label中for设两标签关联-->
<label for="id">姓名:</label>
<input type="text" name="name" size="20" id="male" placeholder="123344@qq.com"/><br>
密码:<input type="password" name="password" maxlength="10"/><br>
<input  type="reset" value="重置"/><br>
<input  type="submit"  value="提交"/><br>
<input type="button" value="登录"/><br>
</fieldset>
<!--图片按钮-->
<input type="image"  src="images/banner_2.gif"/><br />
<!--radio中checked设置默认一个单选;  name设置不能同时勾选-->
性别:<input type="radio" name="sex" checked="checked"  value="男" /> 男
<input type="radio" name="sex" checked="checked" value="女" /> 女<br>
<!--checkbox中checked默认选择;name设前后文交互使用-->
兴趣:<input type="checkbox" checked="checked" name="hobby" value="篮球"/>篮球
<input type="checkbox" value="足球"/>足球
<input type="checkbox" value="游泳"/>游泳<br>
<!--file上传-->
图片:<input type="file"/><br />
<!--下拉菜单;selected默认选正值;name用于前后交互-->
年份<select name="year">
<option value="1990">1990</option>
<option>1991</option>
<option selected="selected">1992</option>
<option>1993</option>
<option>1994</option>
</select>
月份<select name="month">
<option value="一月">一月</option>
<option>二月</option>
<option selected="selected">三月</option>
<option>四月</option>
<option>五月</option>
</select><br />
<!--textarea定义多行的文本输入控件-->
<textarea name="sgreement"  cols="20" rows="5"> 
欢迎发表经典好文章,美文,...
</textarea><br>
<!--hidden设隐藏-->
隐藏:<input type="hidden" name="password" maxlength="10" /><br>
<!--readonly设只读-->
只读:<input type="text" name="name" readonly="readonly" value="1233544"  /><br>
<!--disabled设禁用-->
禁用:<input  type="submit" disabled="disabled" value="提交"/><br>
</form>
</body>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值