HTML的表格、表单和框架
表格元素
<table></table>表格是由table标签定义的，有以下⼏个属性：width：宽度加px是以像素为单位，加百分⽐是以百分⽐放⼤；border：设置边框粗细；cellspacing：设置单元格与table边框的距离；cellpadding设置单元格与单元格之间的距离；bordercolor：设置边框颜⾊。
<tr></tr>表格的⾏
<td></td>表格的列，有以下⼏个属性：width：宽度； height：⾼度；align：⽔平对齐⽅式；valign：垂直对齐⽅式；bgcolor：背景颜⾊；rowspan：上下合并； colspan：左右合并。
align有以下⼏个属性：left：左； right：右；center：居中；
valign有以下⼏个属性：top：上；bottom下；middle：中间；
<th></th>通常做表头
<table border="1" cellspacing="0" cellpadding="" width="490">
<tr>
<td align="center" valign="middle" width="70" height="40">姓名</td>
<td width="70"></td>
<td align="center" valign="middle" width="70">性别</td>
<td width="70"></td>
<td align="center" valign="middle" width="70">出⽣年⽉</td>
<td width="70"></td>
<td width="70" rowspan="4"></td>
</tr>
<tr>
<td align="center" valign="middle" height="40">民族</td>
<td></td>
<td align="center" valign="middle">政治⾯貌</td>
<td></td>
<td align="center" valign="middle">⾝⾼</td>
<td></td>
</tr>
<tr>
<td align="center" valign="middle" height="40">学制</td>
<td></td>
<td align="center" valign="middle">学历</td>
<td></td>
<td align="center" valign="middle">户籍</td>
<td></td>
</tr>
<tr>
<td align="center" valign="middle" height="40">专业</td>
<td></td>
<td align="center" valign="middle" colspan="2">毕业学校</td>
<td colspan="2"></td>
</tr>
</table>
<table border="" cellspacing="0" cellpadding="" width="490">
<tr>
<th height="40">技能、特长或爱好</th>
</tr>
</table>
<table border="" cellspacing="0" cellpadding="" width="490">
<tr>
<td align="center" valign="middle" width="70" height="40">外语等级</td>
<td width="140"></td>
<td align="center" valign="middle" width="70">计算机</td>
<td width="210"></td>
</tr>
</table>
表单元素
<form></form>标签定义表单有以下⼏个属性：action：提交给哪个页⾯ method：数据提交的⽅式（ get：显⽰提交 post：隐式提交）target：页⾯打开⽅式（ _blank：在新窗⼝打开页⾯  _self：在⾃⾝的页⾯打开）
⽂本类
⽂本框<input type="text" name="uid" id="" value=""  placeholder="请输⼊⽤户名"/>
密码框<input type="password" name="pwd" id="" value="" placeholder="请输⼊密码"/>
⽂本域<textarea rows="10" cols="10"></textarea>
隐藏域<input type="hidden" name="hid" id="" value="123" />
⽂本框与密码框的区别是tpye属性不⼀样，form传值时，都是以name = value 的形式去传值。placeholder：默认在⽂本框中显⽰的⽂字
按钮类
普通按钮<input type="button" id="" value="普通登录" />
重置按钮<input type="reset" value="重置" />
图⽚按钮<input type="image" src="img/4_5b613b6b22e220.jpg" name="你好" width="20" height="20" />
提交按钮<input type="submit" id="" name="uid" value="提交" />
普通按钮没有动作显⽰，重置按钮是将表单重置，图⽚按钮和提交按钮有提交功能。
选择类
单选框
性别：<input type="radio" name="" id="" value="" checked="checked" />男<br />
<input type="radio" name="" id="" value="" />⼥
性别：<input type="radio" name="sex" id="" value="" checked="checked" />男<br /> <input type="radio" name="sex" id="" value="" />⼥
当name值⼀样时，实现单选的切换
复选框
<input type="checkbox" name="" id="" value="" />张店html frame
<input type="checkbox" name="" id="" value="" />桓台
<input type="checkbox" name="" id="" value="" />沂源
<input type="checkbox" name="" id="" value="" />⾼青
<input type="checkbox" name="" id="" value="" />临淄
下拉框
<select name="喜好">
<option>玩游戏</option>
<option>听⾳乐</option>
<option>看电影</option>
<option>运动</option>
⽂件选择
<input type="file" name="tp" />
其他属性
readonly ="readonly" ：只读，只提交value值
disabled="disabled"：不可⽤，不能提交value值
账户<input type="text" id="" value=""readonly="readonly" />
账户1<input type="text" id="" value="" disabled="disabled" />
cheched ="checked"  ：是单选框radio和多选框checkbox的默认选中
<p>
性别：<input type="radio" name="sex" id="" value="" checked="checked" />男<br />
<input type="radio" name="sex" id="" value="" />⼥
</p>
<p>
家庭住址：<input type="checkbox" name="" id="" value="" checked="checked" />张店
<input type="checkbox" name="" id="" value="" />桓台
<input type="checkbox" name="" id="" value="" />沂源
<input type="checkbox" name="" id="" value="" />⾼青
<input type="checkbox" name="" id="" value="" />临淄
</p>
selected = "selected" ⽤在下拉列表中，设置哪⼀项选中
<select name="喜好">
<option>玩游戏</option>
<option selected="selected">听⾳乐</option>
<option>看电影</option>
<option>运动</option>
</select>
框架
<iframe></iframe>框架：可以嵌在普通页⾯⾥⾯。有以下⼏个属性：src ：框架⾥⾯显⽰的页⾯的地址；width ：框架的宽度；height：框架的⾼度； frameborder：框架的边； scrolling ：滚动条
<div>
这是我的页⾯
</div>
<iframe src="biaozhu.baidu/" width="300"height="300" >
</iframe>
<iframe src="biaozhu.baidu/" width="300"height="300"  frameborder="no" >
</iframe>
<iframe src="biaozhu.baidu/" width="300"height="300"  frameborder="no" scrolling="yes">
</iframe>
<frameset></frameset>标签：将窗⼝分割的框架集，如果使⽤此框架，当前页⾯不能由<body></body>标签。有以下⼏个属性：：cols ：左右拆分，rows：上下拆分， frameborder ：边框。
<frameset>内涵<frame />标签，有src：框架要显⽰的页⾯地址；scrolling：滚动条⼏个属性。
<frameset cols="400,*">
<frame src="www.baidu/>
<frame src="4.html" />
</frameset>
<frameset rows="400,*">
<frame src="www.baidu/>
<frame src="4.html" />
</frameset>
其他
<marquee></marquee>标签，⽂字滚动标签。direction：滚动⽅向
<marquee direction="up">北京你好</marquee>
<marquee direction="left">北京你好</marquee>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。