今天看视频学习的第一个知识是HTML中的块元素<div>和行内元素<span>。
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>Document</title> 10 11 <style type = "text/css">/*使用层叠样式*/ 12 div,p{/*给所有div和p元素加样式*/ 13 border : 1px solid red; /*添加红色边框*/} 14 15 P{background-color:#99ff66} 16 17 span{border : 1px solid blue;background-color:#00ffff} 18 </style> 19 </head> 20 21 <body> 22 <div>正是雁群排成“人”字，一行行南归时候。月光皎洁浸人，洒满这西边独倚的亭楼。</div> 23 <p>正是雁群排成“人”字，一行行南归时候。月光皎洁浸人，洒满这西边独倚的亭楼。</p> 24 <span>正是雁群排成“人”字，一行行南归时候。月光皎洁浸人，洒满这西边独倚的亭楼。</span> 25 <span>正是雁群排成“人”字，一行行南归时候。月光皎洁浸人，洒满这西边独倚的亭楼。</span> 26 </body> 27 </html>
总结：
<div>没什么意义用的很多的划块工具，一般要与CSS配合使用；
div是个块元素；
<span>没什么意义用的很多的划块；与CSS配合使用；
span是行内元素；
块元素：一般是单独占一行，不管内容多少总是占一行
如:<div>、<p>
行内元素：不会单独占一行，多个行内元素会排在同一行
如:<span>、<font>
结论：一般是快元素嵌套行内元素；
=============================================================================================
第二个知识点是关于有序列表<ul>和无序列表<ol>
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>Document</title> 10 </head> 11 <body> 12 <h3>一剪梅·红藕香残玉簟秋</h3> 13 <ul type = "disc"> 14 <li type = "circle">红藕香残玉簟秋。轻解罗裳，独上兰舟。</li> 15 <li type = "square">云中谁寄锦书来，雁字回时，月满西楼。</li> 16 <li>花自飘零水自流。一种相思，两处闲愁。</li> 17 <li>此情无计可消除，才下眉头，却上心头。</li> 18 </ul> 19 20 <h4>一剪梅·红藕香残玉簟秋</h4> 21 <ol> 22 <li>红藕香残玉簟秋。轻解罗裳，独上兰舟。</li> 23 <li>云中谁寄锦书来，雁字回时，月满西楼。</li> 24 <li>花自飘零水自流。一种相思，两处闲愁。</li> 25 <li>此情无计可消除，才下眉头，却上心头。</li> 26 </ol> 27 28 </body> 29 </html>
ul 无序列表
<ul>或<li>的常用属性：
Type：项目符号的类型；取值：disc(黑点)，circle(空心圆),square(方块);默认为disc；
它们属于块元素；
ol 有序列表
<ol>或<li>的常用属性：
Type: 编号类型; 取值：1,a,A,i,I；
Start: 从第几个开始；
================================================================================================
第三个知识点关于特殊字符标签
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>Document</title> 10 </head> 11 <body> 12 <p>  正是雁群排成“人”字，一行行南归时候。月光皎洁浸人，洒满这西边独倚的亭楼。</p><br> 13 <p>2<3</p><br> 14 <p>3>2</p><br> 15 <p>&</p><br> 16 <p>¥</p><br> 17 <p>×</p><br> 18 <p>&dicide;<p> 19 </body> 20 </html>
空格： 代表一个半角空格;
<(小于号): <
>(大于号)：>
&: &
¥：¥
*: ×；
÷：&dicide；
================================================================================================
第四个就是图文混排的效果主要是在图片标签<img>中添加align属性，取左或右任意一属性
================================================================================================
第五个是滚动字幕效果，marquee
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>Document</title> </head> <body> <a href = "http://www.baidu.com">百度</a> <marquee>默认~</marquee> <marquee direction = "up" bgcolor = "red" width = 20xp>向上</marquee> <marquee direction = "down">向下</marquee> <marquee direction = "left">向左</marquee> <marquee direction = "right">向右</marquee> </body> </html>
murquee语法
<marquee>...</marquee>
<marquee>属性
Direction:滚动方向； 取值：up,down,left,right;
Width: 滚动宽度；
Height：滚动高度；
bgColor: 滚动背景颜色；
scrollAmount: 滚动速度（步长值）；
scrollDelay: 两步之间的停留时间；
loop:循环滚动的次数；
===========================================================================================
第六个的是超链接
1 <html> 2 <head> 3 <title>超链接</title> 4 <meta http-equiv = "content-type" content = "text/html;charset = utf-8"> 5 <head> 6 <body> 7 <a href = "http://www.baidu.com">百度</a> 8 </body> 9 </html>
常用属性：
href：目标文件地址的URL，该URL是相对地址，也可以是绝对地址；
target：目标文件的显示窗口
_blank:在新窗口中打开目标文件
_self:在当前窗口打开目标文件，相当替换；
_parent:在父级窗口中打开目标文件；
_top:在最顶级窗口打开目标文件；
其中_parent和_top常用于框架网页中；
name:定义锚点链接的名称;
绝对地址URL：
1、远程的绝对地址
访问远程的文件，总是以域名、主机名开头。
2、本地的绝对地址