前端第二天
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>
前端之旅第二天
</title>
</head>
<body>
<!-- table是表格，tr是一行，td是一行的一个小格 -->
<!-- border加表格边框，width设置表格宽度，height设置表格高度，align设置表格在页面中的位置 -->
<!-- cellspacing设置单元格之间的距离 cellpadding设置字和表格边框的距离-->
<!-- <thead>,<tbody>和<tfoot>可以进行表格划分 -->
<table border="2" width = "500" height = "100" align="left" cellspacing="0" cellpadding="15">
<!-- caption是表格标题，居中跟着表格可以移动 -->
<caption>信息表</caption>
<tr>
<!-- th表示表头单元格，居中加粗 -->
<th>名字</th>
<!-- rowspan合并列单元格，colspan合并行单元格 合并后需要吧原有的单元格删除不然会溢出 -->
<th rowspan="2">照片</th>
<th>性别</th>
</tr>
<tr>
<td>小聂</td>
<!-- <td>21</td> 删除掉，否则合并溢出 -->
<td><img src="../xiaoxin2.png" width="60" /></td>
</tr>
</table>
<br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/>
<!-- 无序列表ul和li配合使用且ul只能嵌套li 其他任何标签都不可以在ul中 但是在li内可以任意嵌套标签-->
<p><h1>1.无序列表：</h1></p>
<ul>
<li>小新</li>
<li>广志</li>
<li>美伢</li>
</ul>
<!-- 和无序列表类似，把ol改成ul -->
<p><h1>2.有序列表：</h1></p>
<ol>
<li>中国</li>
<li>美国</li>
<li>英国</li>
</ol>
<!-- 自定义列表dl，dt，dd -->
<p><h1>3.自定义列表：</h1></p>
<dl>
<dt>湖北省</dt>
<dd>襄阳市</dd>
<dd>武汉市</dd>
<dd>宜昌市</dd>
</dl>
<p>-------------------------------------</p>
<form action="" method="POST" >
<!-- 文本框用input，type表示输入框内文本类型 value可以把框预先填入文本，name可以把该输入框定义名字(后台来看属性否则表单多了区分不开)-->
<p>用户名: <input type = "text" value="请输入用户名" name="username"/></p>
<p>密   码: <input type = "password" /></p>
<!-- radio单选框，checkbox多选框，checked表示事先已经被选择 -->
<p>性别：男 <input type="radio" name="sex" checked="checked"/>
女 <input type="radio" name="sex"/></p>
<p>爱好: <br/>
打篮球<input type="checkbox" name="hobby" checked="checked"/> <br />
打游戏<input type="checkbox" name="hobby"/> <br/>
羽毛球<input type="checkbox" name="hobby"/> <br/>
</p>
<input type="button" value="张宇翔是傻逼"/>
<input type="submit" />
<input type="reset" />
<!-- 图片提交按钮，必须包含src属性 -->
<input type="image" src="../HTML1/xiaoxin.jpg" width="100"/><br/>
上传头像：
<!-- 文件域，上传文件用 -->
<input type="file" /> <br/>
<!-- 文本域输入多文本 -->
<textarea></textarea> <br />
<!-- 下拉列表 -->
<select>
<option>--请选择城市--</option>
<option>北京</option>
<option>襄阳</option>
<option>天津</option>
</select> <br/>
</form>
<p>-------------------------------------</p>
</body>
</html>
扫一扫
1557
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
