HTML学习笔记（一）

本节学习内容

HTML说明
HTML头部标记
标题字
段落标记
建立超链接
使用图像

HTML说明

• HTML是一款描述性标记语言，不是编程语言
• 一个完整的HTML文档必须包含3个部分：一个由元素定义的文档版本信息；一个由定义各项声明的文档头部；一个由定义的文档主体部分

HTML头部标记

• ...头部标记，一般包括标题、基础信息、文档样式表定义、脚本和元信息，定义在头部的信息往往不会直接显示在网页上
• 标题标记，页面的标题只有一个
• 元信息标记meta,meta元素提供的信息不显示在页面上，一般用来定义页面信息的说明、关键字和刷新等。一个HTML页面中可以有多个meta元素，该元素的属性有name和http-equiv，其中name属性主要用于描述网页，以便于搜索引擎查找、分类,语法
• name="keywords"设置网页的关键字属性，在content中定义具体的关键字
• ，name设置成description页面说明，在content中定义具体的描述语言
• ，name设置成generator编辑工具，在content中定义具体的编辑工具名称
• ，name设置成author作者信息，在content中定义具体的信息
• ，网页中还可以设置语言的编码方式。http-equive用于传送HTTP通信协议的标头，而在content才是具体的属性值。charset用于设置网页的内码语系，也就是字符集的类型。
• ，标记可以使网页在经过一定时间后自动刷新。refresh表示网页的刷新，在content中设置刷新的时间和刷新后的链接地址，时间和链接地址之间用分号隔断，默认情况系，跳转时间的单位是秒

标题字

• 标题字标记

  到

• 标题字对其属性，left、center、right。

段落标记

• 段落标记

  段落文字

  ，每一个新的段落标记开始的同时意味着上一个段落的结束
• 换行标记
，作用是在不另起一段的情况下强制当前文本换行，
是唯一可以为文字分行的方法，标记

  可以为文字分段

• 不换行标记,网页中某一行的文字过长，浏览器会自动对文字进行换行处理，可以使用标记来禁止自动换行
• 水平线标记

  ---

  ,代表水平分割模式，并会在浏览器中显示一条线
• 其他标记-特殊符号的表示

特殊符号	符号的代码	特殊符号	符号的代码
一个半角空格	;	“	";
&	&;	<	<;
>	>;	×	×;
§	§;	©	©;
®	®;	™	&trade;

建立超链接

• 超链接能够浏览者在各个独立的页面之间方便的跳转。网站都是有众多的网页组成，网页之间都是通过链接方式相互关联的。超链接的作用范围很广，可以将文档中的任何文字及任意位置的图片设置为超链接。
• 超链接分为外部链接、电子邮件链接、锚点链接、空链接、脚本链接。
• 每个网页都有一个唯一的地址，称为统一资源定位符（URL）。在网页中创建内部链接的时候，一般不会指定链接文档的完整URL，而是指定一个相对当前文档或站点根文件夹的相对路径。
• 绝对路径：是包括服务器规范在内的完全路径。好处是它同链接的源端点无关，只要网站的地址不变，无论文档在站点中如何移动都可以正常的而不会发生错误。另外，希望链接同站点上的其他内容，就必须使用绝对路径。缺点在于不利于测试，不利于站点的移植。
• 相对路径：可以表述源端点同目标端点之间的相互位置，它同源端点的位置密切相关。好处在于如果站点的结构和文档的位置不变，那么链接就不会出错。可以将整个网站移植到另一个地址的网站中，而不需要修改文档中的链接路径。
• 提示：插入图像时，如果使用图像的绝对路径，图像在远程服务器而不是在本地硬盘上，则将无法在文档窗口中查看该图像。对于图像尽量使用相对路径
• 内部链接是指链接的对象是在同一个网站中的资源
• 链接的目标窗口，在创建网页的过程中，默认情况下超链接在原来的浏览器窗口中打开，可以使用target属性来控制打开的目标窗口。语法为：，target参数的取值有四种：
  
  -self(在当前页面中打开链接)、
  
  -blank(在一个全新的空白窗口中打开链接)、
  
  -top(在顶层框架中打开链接，也可以理解为在根框架中打开链接)、
  -parent(在当前框架的上一层打开链接)
• 锚点链接：当页面中由于文本或者图像过多，导致页面过长，访问者需要不断拖动滚动条查看文档内容。为了方便文档中的内容，在文档中需要进行锚点链接。语法为，利用锚点的名称可以链接到相应的位置。这个名称可以是数字或英文，或者两者的混合。同一个网页中可以有无数个锚点，但是不能有相同名称的两个锚点
• 链接同一页面中的锚点，用#号以及锚点的名称作为href的属性值，语法为
• 提示：如果链接的锚点在屏幕上已经可见，那么浏览器可能不会再跳到那个锚点。如果链接的锚点正好在屏幕的底部，那么根据屏幕的大小，浏览器也不能跳到该锚点，因为已经到了底部，只能尽可能的接近锚点
• 链接到其他页面中的锚点：锚点不但可以链接到同一个页面，也可以在不同页面中设置。语法：...
• 锚点链接常常用于那些内容庞大繁杂的网页。通过单击命名锚点，能够快速重定向网页特定的位置，如快速到页首、页尾或者网页中某段位置，便于浏览者查看网页内容。
• 外部链接是指跳转到当前网站之外的资源中。如:
  （1）链接到外部网站....
  （2）链接到E-mail...
  （3）链接到FTP...FTP代表文件传输协议，一个FTP站点通常包含一些上传和下载文件的文件目录
  （4）链接到Telnet...Telent常用来登陆一些BBS网站，也是一种远程登录方式
  （5）下载文件...如果超链接指向的是一个文件,单击链接的时候就会下载文件

使用图像

• 网页中常用的图像格式优3种:GIF JPEG和PNG
  
  (1)GIF -- Graphic Interchange Format图像交换格式,优点:可制作动态图像、可以将图像以交错的方式在网页中呈现(如图像尚未下载,浏览器会先以马赛克的形式将图像慢慢显示,让浏览者可以大致猜出下载图像的雏形)
  
  (2)JPEG -- Joint Photographic Exports Group它是一种图像压缩格式
  
  (3)PNG -- Portable Network Graphics图像格式是一种非破坏性的网页图像文件格式
• 插入图像标记img img元素的属性定义:

属性	描述	属性	描述
src	图像的源文件	alt	提示文字
width,height	宽度和高度	border	边框
vspace	垂直间距	hspace	水平间距
align	排列	dynsrc	设定avi文件的播放
loop	设定avi文件循环播放次数	usemap	映像地图
start	设定avi文件播放方式	lowsrc	设定低分辨率图片
loopdelay	设定avi文件循环播放延迟

• 图像的提示文字alt。提示文字有两个作用，当浏览该网页时，如果图像下载完成，将鼠标指针放在该图像上，鼠标指针旁边会出现提示文字。也就是说，当鼠标指针指向图像上方时，稍等片刻，可以出现图像的提示性文字，用于说明说着描述图像。第二个作用是，如果图像没有被下载，在图像的位置上就会显示提示文字。
• 图像的超链接，除了文字可以添加超链接之外，图像也可以设置超链接。同一个图像的不同部分也可以链接到不同的文档，这就是热区链接。超链接也是用标签来完成。
• 图像热区链接：在HTML中可以把图片划分为多个热点区域，每一个热点区域链接到不同的网页。这种效果的实质是把一幅图片划分为不同的热点区域，再让不同的热点区域进行超链接，这就是映射地图。
  

语法：
首先需要在文件中设置映射图像名，在图像的属性中使用标记添加图像要引用的映射图像的名称如下：
![](图像地址)
然后需要定义热区图像以及热区的链接属性如下：

说明：在该语法中需要先定义映射图片的名称，然后再引用这个映射图像