一个网页中包含的基本框架如下：
<!DOCTYPE HTML> <html> <head> <meta http-equiv ="Content-Type" content = "text/html;charset=utf-8"> <title>Title</title> <style> </style> <script> </script> <link> </head> <body> </body> </html>
Html和CSS的关系：
- html是网页想要给用户展示的内容，css是内容显示的样式，javascript是可以实现页面间的交互。
html页面上的标签：
- <hn></hn>：标题标签；<p></p>段落标签；<img>图片标签。
- 每一个在浏览器中显示的内容都是在标签中的。
- html中的标签都是成对出现的。html标签是不区分大小写的。
html的头部包含有：
- <title></title>：标题之间的文字作为网页的标题信息，出现在浏览起的标题栏中。
- <meta>
- <link>
- <script></script>
- <style></style>.
标签的用途和标签在浏览器中的默认样式：
- 语义化：更容易被搜索引擎收录，更容易让屏幕阅读器读出网页的内容。
- <body>：网页中需要显示的内容一定要写在<body>中。
- <p>： p标签段前段后都有空白。
- <hx>：标题标签的样式都会加粗。
- <strong>和<em> ：特别强调。<em>表示强调，用斜体表示，<strong>表示更强烈的强调，用粗体表示。
- <span>：span标签是没有强调的，它的作用主要是为了设置单独的样式。
- <q>：q标签是短文本引用（不是作者本人所写，引用他人的话。要引用的文本不需要加双引号，q标签会自动加上双引号的。q标签的真正关键点不是双引号，而是它的语义是引用别人的话）。
- <blockquote>： blockquote也是引用别人的文本，但是它是对长段文字的引用。浏览器对blockquote的引用是有缩进样式的。
- <br>： br标签分行显示文本。br是空标签，没有内容的标签就是空标签，空标签只需要写一个起始标签。html中输入回车和空格是没有作用的。
- ：空格标签。
- <hr> ：添加水平横线。hr也是空标签。默认样式线条比较粗，颜色为灰色。
- <address>：为网页加入地址信息。默认为斜体。<em>强调也是斜体。
- <code>：代码标签。如果在文章中需要插入多行代码，一般不用code标签可以使用<pre>标签。
- <pre> ：加入大段代码是使用。预格式处理文本。被包围在pre标签中的代码会保留空格和换行的。pre标签不是仅仅为了加入大段代码段使用的，如果网页中需要显示别的预显示格式的都可以使用。一般情况下主要用来显示打断代码。
- <ul>和 <li>：添加列表(无序)。默认样式是在每列前面加一个圆点。
- <ol>和<li>：列表（有序）。默认样式在每列前面带一个序号，默认从1开始。
- <div>：独立的逻辑部分。属性：id身份表示，唯一。
- <table>：
<table> <tbody> <tr> <th>班级</th> <th>学生数</th> <th>平均成绩</th> </tr> <tr> <td>一班</td> <td>30</td> <td>89</td> </tr> <tr> <td>二班</td> <td>35</td> <td>85</td> </tr> <tr> <td>三班</td> <td>32</td> <td>80</td> </tr> </tbody> </table>
创建表格的5个元素：table,tbody,tr,th,td
table:整个表格以table开始。
tbody：当表格内容很多时，会下载一点显示一点，但是如果添加了tbody则会等表格完全下载完成后再显示。
tr：一行。
td：一个单元格。
th：表格的头部的一个单元格。
table表格在没有修改样式之前是没有网格线的。表头（th标签）默认是粗体居中。
caption：为表格添加标题和摘要。
摘要：摘要的内容是不会显示的，它的作用是增加表格的可读性：<table summary="这是摘要在浏览其中不显示">。
标题：用于描述表格的内容，在表格的上方：<table><caption></caption><tr><td></td></tr></table>
- <a>：语法是：<a href="目标网址" title="鼠标划过显示的文本" target="是否新打开一个页面">链接显示的文本</a>。默认样式为蓝色（被点击过的显示紫色）。如果target为_blank则新打开一个浏览器窗口。
- <mailto>：在网页中链接emial地址。如果有多个参数，第一个参数后面必须是？号，后面的是&分割。
<a href="mailto:yy@imooc.com?subject=了不起的盖茨比有感&body=你好，对此评论有想法">对此影评有何感想，发送邮件给我</a>
- <img>：在网页中插入图片。语法：<img src="图片的所在的位置" alt=“图片加载失败后显示的文本” title=“提示文本鼠标划过是显示”/>。
- <form>表单：<form method="传送的方式" action="服务器文件">。所有表单控件都必须放在form标签内。
- 文本输入框和密码输入框：
<form> <input type="text/password" name="名称" value="文本" /> </form>
- <textarea> ：多行文本。<textarea rows="行数" cols="列数"></textarea>。标签之间可以输入默认值。可以用css样式的width替换cols，height替换rows。
- 复选框和单选框：
<input type="radio/checkbox" value="值" name="名称" checked="checked"/>
value：提交到服务起中的值。name：控件名，用户后台使用。checked：设置为checked是默认为选中。同一组单选按钮name一定要一致。
- 下拉列表：
<select> <option value="看书">看书</option> <option value="旅游" selected="selected">旅游</option> <option value="运动">运动</option> <option value="购物">购物</option> </select>
value为向服务器传入的值，如果selected属性设置为selected时则默认为选中。下拉列表也可以多选，在select标签中设置 multiple属性为multiple，select就可以实现多选。
- 提交按钮：
<input type="submit" value="提交">
- 重置按钮：
语法： <input type="reset" value="重置"> type：只有当type值设置为reset时，按钮才有重置作用 value：按钮上显示的文字
- <label>：为鼠标用户改进了可用性，如果你点击了该文本，浏览器就会自动把焦点转到跟该文本相关的表单控件上。
语法： <label for="控件id名称"> 注意：标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。