一 元素的概念与三个常用标签
HTML元素指的是从开始标签到结束标签的所有代码
| 开始标签 | 元素内容 | 结束标签 |
| <h1> | h标签用来表示标题 | </h1> |
| <p> | p标签表示一个段落 | </p> |
| <hr> | 我是一个单标签，我会给文档加一个横线 | *注意我没有结束标签哦！ |
二 元素的属性
属性的作用就是就为元素提供更多的信息，大多数元素都可以拥有属性
属性的语法：<标签 属性1=参数1>
注意空格的使用
（1）align属性：我的作用是指定内容的对齐方式,left:左对齐（我是默认值哦）;right：右对齐;center：居中对齐
（2）bgcolor属性：我的作用是添加一个背景颜色
三 文本元素
1 b元素： 我的作用就是 加粗文字；
2.br元素： 我的作用就是强制换行；
3.i元素： 我的作用就是让 文字倾斜；
4.del元素： 我的作用就是 删除文子
5.strong元素： 我的作用是强调一段文本我的实际作用也是加粗文字.
6.wbr元素： 我的作用是表示安全换行Theshiyigehenchanghenchangdedanci.
再来对比一下没有安全换行的文本Theshiyigehenchanghenchangdedanci.
7.em元素： 我的作用是强调，我的实际作用也是让文字倾斜
8.s元素： 我的实际作用就是 删除线;从语义上来看，表示不准确的删除。
9.u元素： 我的实际作用就是 给文字加下划线
10.ins元素： 我的实际作用也是 给文字加下划线；从语义上来看，是添加一段文字，起到强调作用。
11.small元素： 我的作用是 添加小号字体 ，从语义上来看，用于免责声明和澄清声明。
12.sub和sup元素：我们的作用就是添加下标和上标： sub表示下标：HTML5;sup表示上标我的房子100m2
13.dfn元素： 我的作用从语义上看表示定义术语，是对一个词或短语的解释，实际效果就是倾斜文本
14.abbr元素： 我的作用是表示一段文本的缩写,在文本显示上没有任何实际效果，比如WTO
15.q元素： 我的作用从语义上看表示引用来自其他地方的的内容， 我的实际作用就是给文本加上双引号
16.code等元素： code元素用来表示计算机代码片段；function(){}
var元素用来表示编程语言中的变量； num
samp元素表示程序或计算机的输出您没有权限浏览该网页
kbd元素表示某部分内容是由用户利用键盘输入如：请按Enter键
*这几个元素属于英文范畴，必须将lang="en",英语才能体现效果。
17.ruby元素： 我的作用是表示位于表意文字上方或右方的注音符号 英(ying)雄(xiong)***不常用，浏览器支持不太好，很多浏览器不支持此功能
18.cite元素： 我的作用从语义上来看就是表示引用其他作品的标题。 实际效果就是加粗文本
19.bdo元素： 我的功能是设置文字方向，必需使用dir属性才可以设置，共两个值，rtl（从右到左）；ltr（从左到右）默认为ltr
rtl就是从右到左，即：right to left
20.mark元素： 我的作用是突出显示文本，用于记号， 我的实际作用就是加上一个黄色的背景。
21.time元素： 我的作用从语义上来看就是表示日期和时间，例如 2015-9-18
22.span元素： 我的作用就是表示一般性的文本，没有特殊效果
四 超链接
目录语法：
同一个目录：直接写文件名称 或 ./文件名 比如：tp.jpg或者./tp.jpg
在下级（子）目录：xxx/tp.jpg
在下下级目录：xx/xxx/tp.jpg
在上级（父）目录：../tp.jpg
在上上级目录：../../tp.jpg
属性
1.target属性的四个值：
_self：当前位置；
_blank:新窗口;
_top(最顶层框架)，_parent(父框架)，这两个属性咱不做讲解，后边的章节再说；
2.id属性：通用属性，可以理解为元素的身份证；name属性：可以理解为元素的名字
五 img元素
1.img的属性
1.src:必要属性，制定图片来源的路径;
2.alt属性：当图片无法显示时的替代文字；
3.width和height属性，指定图片的宽度和高度；单位是像素或百分比；
六 绝对路径和相对路径
1.绝对路径
需要指出链接资源的绝对位置，与你的HTML文档的位置无关；
1. 服务器中的位置：href="http://www.nipic.com/show/2/52/8144173k9c3cc84f.html"
2. 本地存储的位置：file:///D:桌面HTML5课程HTML5入门实例课程lesson9西施.png
2.相对路径
如果链接资源与你的HTML文档位于同一个路径或者文件夹里，可以省略；否则必须指出相对路径，和HTML文档的位置有关；
同一个路径： 直接写文件名称 或 ./文件名 比如：tp.jpg或者./tp.jpg
在下级路径： 路径名称/资源名称：xxx/tp.jpg
在下下级路径： xx/xxx/tp.jpg
在上级路径： ../资源名称：../tp.jpg
在上上级路径： ../../tp.jpg
七 列表
1.无序列表的type属性
无序列表的type属性有三个值：1.disc（默认值）；2.circle；3.square
2.有序列表的基本格式
3.有序列表的type属性
1.整数（默认值）；2.大（小）写字母ABC...3.大小写的罗马字母：i ii .../I II III
4.有序列表的start属性
定义列表的开始序号，比如第一项不是数字1，而是从10开始.......
5.有序列表的value属性
定义某个单个列表项的序号.......
6.有序列表的value属性
自定义列表项组成：由 dl定义列表；dt定义列表项目；dd定义列表内容；
八 表格
1.表格构成三个基本要素
table：表格的范围，外框；用来定义表格，表格的其他元素包含在table标签里面；
tr: 表格的行；
td:表格的单元格
th元素:为表格添加标题行
th元素用来定义表格的标题单元格，他是tr元素的子元素，必须放在tr标签里边；tr元素的内容会自动居中对齐并加粗文字
colspan元素:横向合并单元格
属性值为正整数，表示该单元格合横向合并的列数，语法为 <td> <colspan>="3" </td>
rowspan元素:纵向向合并单元格
属性值为正整数，表示该单元格合纵向向合并的行数数，语法为 <td> <colspan>="3" </td>
九 style元素与HTML样式基础
1.外部样式表：通过 link元素引入外部样式表；< link rel="stylesheet" type="text/css" href="" >
2.内部样式表： <style type="text/css"></style>
3.内联样式表：<p type="color:red"> </p>
十 div元素和布局
元素的分类
- 块元素:主要特征是会产生换行效果，自动与其他元素分离成两行；通常可以作为容器在内部添加其他元素。
已经学过的块元素有：
h1~h6;hr;ul;ol;p;table.........
- 内联元素:不会产生换行效果，会和其他元素并联排列；
已经学过的内联元素有：
b;i;br;img;.........
div元素和布局
- div元素是通用的块元素，内部可以包含其他各种元素包括其他div元素；并且可以通过CSS设置样式来完成复杂的页面的布局
- 通过一个简单的实例了解div布局是如何实现的
十一 通用属性
- id属性：id属性用于指定元素的识别名称，相当于一个人的身份证，是唯一的，同一个文档中不能有重复的id；一般配合CSS和JavaScript来选择元素。
2 class属性：class属性用于指定元素的类别名称，可以使用class元素给同一个文档中的多个元素进行归类，CSS就可以通过class个同一类元素设置统一的样式。
3.style属性：stlyle属性用于给元素设定样式（内联样式或内部样式表）.
4.title属性：title属性用于显示省略的内容（或补充/提示说明的内容）：当光标移动到元素内容上时显示title里的内容.
5.dir属性：dir属性用于设定元素标签内容的文字方向.在讲文本样式的 bdo元素时候用过。
6.lang属性：lang属性用于指定语言，比如中文还是英文：zh-cn/en;除了在html标签中设置，它还可以在特定元素中使用，改变该元素使用的语言.
7.其他通用属性
其他通用元素还有：
-
-
-
-
- accesskey:元素快捷键
- tabindex：元素移动顺序
- draggable：元素拖动
- contenteditable:元素是否允许编辑
- hidden:隐藏元素
- spellchcheck：元素检查
- contextmenu:元素快捷菜单
- data-yourvalue：自定义属性
-
-
-