<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>fzzy</title>
<style type="text/css">
h1{
color: yellow;
text-align: center;
font-size: 72px;
}
</style>
</head>
<body>
<!-- 只有h1-h6 输入其他的无效 -->
<a name="top"></a>
<a href="#buttom">回底部</a>
<abbr title="I LOVE YOU">love</abbr>
<h1>大家好!</h1>
<h2>大家好!</h2>
<h3>大家好!</h3>
<h4>大家好!</h4>
<h5>大家好!</h5>
<h6>大家好!</h6>
<abc>大家好!</abc>
<!-- 水平分割线 -->
<hr>
<h1 title="舒婷" id="title">致橡树</h1>
<p><em>我</em>如果<strong>爱你</strong></p>
<p>绝不学<ins>攀援</ins>的凌霄花<sup>1</sup></p>
<p>借你<del>的高枝</del>炫耀自己<sub>2</sub></p>
<p></p>
我如果爱你<br>
绝不学攀援的凌霄花<br>
借你的高枝炫耀自己<br>
<button onclick="sayHello()">确定</button>
<figure>
<img title="头像" src="image/123.png">
<!--figcaption 图片的说明 -->
<figcaption>图1.头像</figcaption>
</figure>
<!--definition list -->
<dl>
<dt>
<!-- alt 如果图片没有显示出来，替换的文字 -->
<!-- 尽量不要把宽度和高度同时调整 -->
<img src="https://www.python.org/static/img/python-logo@2x.png">
<p></p>
<img align="right" width="100" src="image/123.png " alt="兔兔">
大师大师大师的hi欧文ID偶去我的hi哈迪阿斯达双排扣大开大喷水电机匹配平静地爬到怕是
</dt>
<dt>Python</dt>
<dd>一种好用的面向对象的解释型编程语言</dd>
<dd>GOOD</dd>
</dl>
<h2>今天为你推荐的水果</h2>
<ol>
<!--ol 有序列表-->
<!--ul 无序列表-->
<!--li 列表项-->
<li>苹果</li>
<li>草莓</li>
<li>山竹</li>
</ol>
<!-- anchor 超链接
1.页面链接
2.锚点连接
3.功能连接
-->
<!-- target = "_blank" 默认是self 打开一个新的窗口 -->
<a href="http://www.baidu.com" target="_blank">百度一下</a>
<a href="#title">致橡树</a>
<a href="other.html">其他界面</a>
<a href="#top">回顶部</a>
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=983032100&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:983032100:53" alt="123" title="123"/></a>
<a name="buttom"></a>
<script type="text/javascript">si
function sayHello() {
window.alert('欢迎加入湖人！')
}
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div><span></span></div>
<audio controls="" autoplay="true">
<source src="./image/张卫健-法术乌魔多.mp3">
</audio>
<video width="400" controls="" autoplay="true">
<source src="./image/wangli.mp4">
</video>
<iframe width="500" src="http://www.baidu.com" frameborder="0">
</iframe>
<h2>大家好！</h2>
<hr>
<form action="" method="post" enctype="multipart/form-data">
<fieldset>
<legend>基本信息</legend>
<p>
用户名:<input type="text" placeholder="请输入用户名">
</p>
<p>
密码:<input type="password" >
</p>
<p>
性别:
<!-- name要设置成一样才能实现单选 -->
<input type="radio" name="sex" checked>男
<input type="radio" name="sex">女
</p>
</fieldset>
<fieldset>
<legend>附加信息</legend>
<p>
爱好:
<input type="checkbox" name="fav" checked>音乐
<input type="checkbox" name="fav">游戏
<input type="checkbox" name="fav">美食
<input type="checkbox" name="fav">美食
<input type="checkbox" name="fav">唱歌
<input type="checkbox" name="fav" checked>跳舞
</p>
<p>
出生日期:
<input type="date">
</p>
<p>
省:
<select>
<option value="" selected>山西</option>
<option value="">四川</option>
<option value="">北京</option>
<option value="">上海</option>
<option value="">四川</option>
<option value="">河北</option>
</select>
</p>
<p>
<!-- tel文本框切换到数字 移动端-->
手机:<input type="tel">
</p>
<p>
邮箱:<input type="email">
</p>
<p>
头像:<input type="file">
</p>
<p>
<input type="submit" value="提交">
<input type="reset" value="重置">
</p>
<p>
个人介绍:
<textarea cols="30" rows="10"></textarea>
</p>
<p>
<input type="number">
</p>
</fieldset>
</form>
<a href="index.html">返回首页</a>
<!-- table>tr*3>td*5 -->
<!-- tr.(td*5)*3 -->
<!-- ol>li*5 -->
<table border="1">
<!-- 表格标题 -->
<caption>学生信息表</caption>
<thead>
<tr>
<!-- th 表头 自动加粗和居中 -->
<th width="100">学号</th>
<th width="150">姓名</th>
<th width="80">年龄</th>
<th width="180">生日</th>
<th width="180">籍贯</th>
<th width="80">语文</th>
<th width="80">数学</th>
<th width="80">英语</th>
</tr>
</thead>
<tbody>
<tr>
<td>1001</td>
<td align="center">张三</td>
<td>12</td>
<!-- 跨行 -->
<td align="center" rowspan="2">97-1-1</td>
<td>四川</td>
<!-- 跨列 -->
<td align="center" colspan="3">29</td>
</tr>
<tr>
<td>1002</td>
<td>李四</td>
<td>21</td>
<td>山西</td>
<td>78</td>
<td>21</td>
<td>78</td>
</tr>
</tbody>
<tfoot>
<td align="center" colspan="5">平均分</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tfoot>
</table>
</body>
</html>
