08_MDN前端基础学习/一，HTML入门—信件作业/转载的总结
一，练习地址
https://developer.mozilla.org/zh-CN/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter
二，基础笔记转载
https://blog.****.net/JOJOY_tester/article/details/53222425
超链接
1.连接其他网址（输入要连接到的网址）
<a href="http://www.baidu.com">1.百度一下</a><br>
2.连接本地文档 （直接输入本地文件地址）
<a href="1_3.html">八阵图</a><br>
3.图片链接（必须加后缀名啊）
<a href="http://www.baidu.com"> <img src=”图片地址.后缀名” alt=” ”> </a><br>
这个是元素的嵌套，图片地址必须要有后缀名不然无法打开 通过点击图片会跳转到对应链接
src属性：加图片链接地址，可以是本地的也可以是网页的；
<img src="http://www.baidu.com/img/bdlogo.gif" />
<img src="bdlogo.gif" />
4.邮箱连接（服务器配置要发邮件就会自动打开）
<a href="mailto:[email protected]">联系我</a><br>
5.下载链接（服务器要提供下载的东西，当浏览器不能解析就是下载）
<a href="11.tar.gz">11</a>
目录语法：
同一个目录：直接写文件名称或 ./文件名比如：tp.jpg或者./tp.jpg
在下级（子）目录：xxx/tp.jpg
在下下级目录：xx/xxx/tp.jpg
在上级（父）目录：../tp.jpg
在上上级目录：../../tp.jpg
超链接属性
1.target属性的四个值：
_self：点击超链接时就在当前位置打开页面，默认值；
<a href="1_3.html" target=”_self”>八阵图</a><br>
_blank:点击超链接时新建一个窗口打开;
<a href=”http://www.baidu.com target=”_blank”>百度</a>
_top(最顶层框架)和_parent(父框架)
2.id属性：通用属性，可以理解为元素的身份证；name属性：可以理解为元素的名字
<a href=”#id属性值”>锚点1</a> 作用：点击上面的就会定义到下面对应的内容
<a href=”#id属性值”>锚点2</a> href属性值是#+下面定义的id属性值
<a href=”#id属性值”>锚点3</a>
<a id=”a”>锚点1 只有<a>标签没有结束标签
这里就可以输入锚点1的内容了
<a id=”b”>锚点2
锚点2内容
<a id=”c”>锚点3
锚点3内容
元素嵌入图片
img的属性
1.src:必要属性，指定图片来源的路径;
2.alt属性：当图片无法显示时的替代文字；
3.width和height属性，指定图片的宽度和高度；单位是像素px或百分比（width百分比是相对与body页面大小，heigth百分比无意义）
4,title属性，属性值为字符串，效果是当鼠标移动到该位置时显示该内容
<img src=”1.png” alt=”当图片无法显示时的替代文字” width=”100px” height=”100px” title=”11221”>
绝对路径和相对路径
列表
1，无序列表的基本格式
<ul>定义无序列表，<li>是列表项
<ul>
<li> 列表内容</li>
<li>列表内容</li>
<li>列表内容</li>
……………
</ul>
2，无序列表type的属性
无序列表的type属性有三个值：1.disc（默认值实心小圆；2.circle空心小圆；3.square小方块
<ul style="list-style:none">这个样式表示列表前面什么都没有
注意：type属性，html5不提议直使用type属性设置样式，应该用css样式表实现内容和样式的分离来。css可以设置复杂的样式。
有序列表
1，有序列表的基本格式
2，有序列表的type属性
整数（默认值）；2.大（小）写字母A\B\C…3.大小写的罗马字母：i ii …/I II III
3，有序列表的start属性
定义列表的开始序号，比如第一项不是数字1，而是从10开始…
4，有序列表的value属性
定义某个单个列表项的序号.......value属性是放在<li>标签里面的
自定义列表
自定义列表项组成：由 dl定义列表；dt定义列表项目；dd定义列表内容
表格元素
表格的基本构成
表格的属性
表格的合并
1，表格构成的3个基本要素
table：表格的范围，外框；用来定义表格，表格的其他元素包含在table标签里面；
tr: 表格的行；
td:表格的单元格
border属性定义表格的边框宽
<table style=”border:1;text-align:center;margin:0”> margin属性设置页面外边距为0，margin:0; padding:0; list-style:none;全部布满网页中所有的元素的外边距和内边距都为0项目列表前的类型为无
2.关于表格的一点说明
HTML5中删除了HTML4中table的大部分属性，HTML5中推荐使用CSS设定原来table属性实现的效果
3.th元素，为表格添加标题行
th元素用来定义表格的标题单元格，他是tr元素的子元素，必须放在tr标签里边(和td元素一样)；tr元素的内容会自动居中对齐并加粗文字
4.colspan元素用来横向合并单元格
属性值为正整数，表示该单元格合横向合并的列数，语法为 <td colspan="3"> </td>则在右边两列删除2个单元格才行
5.rowspan元素用来纵向合并单元格
属性值为正整数，表示该单元格合纵向向合并的行数数，语法为 <td colspan="3"></td>则在下面两行分别删除一个单元格才行
6.caption元素用来为表格添加标题
用来制定表格的标题或者说明；是table的子元素，必须放在table中使用。
caption的align属性可以设置标题的位置，但是，在HTML5中已经被废弃，不推荐使用，建议使用CSS样式设置。
7.thead/tbody/tfoot元素
thead元素：表格的表头；tfoot元素:表格的页脚；tbody元素：表格的主体；表格规范的写法应该包含这三部分内容。注：这三个主要结合CSS、javaScript来使用
8.colgroup元素 设置列的宽度
colgroup元素用来组合列，他的span属性可以设置组合列的数目；它可以包含一个子元素 col;
colgroup元素为table元素的子元素，必须放在caption元素之后，thead元素之前。
<table border="1">
<caption>table</caption>
<colgroup span="1" style="width:100px"><col style=”background:red”></colgroup> span默认为1，表示1列，span=n表示n列都是后面的宽度，
<colgroup span="1" style="width:300px"></colgroup> 要设置不同列不同宽度，就像这样写几个colgroup。
<colgroup span="1" style="width:600px"></colgroup>
<thead>
<tr><th colspan="3">title</th></tr>
</thead>
<tbody>
<tr><td>单元格</td><td>单元格</td><td>单元格</td></tr>
<tr><td>单元格</td><td>单元格</td><td>单元格</td></tr>
<tr><td>单元格</td><td>单元格</td><td>单元格</td></tr>
<tr><td style=”height:25px”>单元格</td><td>单元格</td><td>单元格</td></tr> 设置这行单元格高度
<tr><td>单元格</td><td>单元格</td><td>单元格</td></tr>
</tbody>
<tfoot>
<tr><td>备注：</td><td colsapn="2"></td></tr>
</tfoot>
</table>
9.col元素 是单标签，设置列的属性，如颜色
col元素用来设定列的属性，他也可以使用span属性；
col元素一般作为colgroup元素的子元素配合使用。
表格例子：
特殊符号的使用
1.HTML 实体
在 HTML 中，某些字符是预留的。
在 HTML 中不能使用小于号（<）和大于号（>），这是因为浏览器会误认为它们是标签。
如果希望正确地显示预留字符，我们必须在 HTML 源代码中使用字符实体（character entities）。
实体元素：有些特殊符号浏览器是不能解析的，就要用特殊符号的实体代替，eg：
 表示一个空格，参考