什么是HTML文件？
∙ HTML的英文全称是Hypertext Marked Language，中文叫做“超文本标记语言”。
∙ 和一般文本的不同的是，一个HTML文件不仅包含文本内容，还包含一些Tag，中文称“标记”。
∙ 一个HTML文件的后缀名是.htm或者是.html。
∙ 用文本编辑器就可以编写HTML文件。
∙ 这就试写一个HTML文件吧！
∙ 打开你的Notepad，新建一个文件，然后拷贝以下代码到这个新文件，然后将这个文件存成first.html。
<html>
<head>
<title>Title of page</title>
</head>
<body>
This is my first homepage. <b>This text is bold</b>
</body>
</html>
要浏览这个first.html文件，双击它。或者打开浏览器，在File菜单选择Open，然后选择这个文件就行了。
示例解释
这个文件的第一个Tag是<html>，这个Tag告诉你的浏览器这是HTML文件的头。文件的最后一个Tag是</html>，表示HTML文件到此结束。
在<head>和</head>之间的内容，是Head信息。Head信息是不显示出来的，你在浏览器里看不到。但是这并不表示这些信息没有用处。比如你可以在Head信息里加上一些关键词，有助于搜索引擎能够搜索到你的网页。
在<title>和</title>之间的内容，是这个文件的标题。你可以在浏览器最顶端的标题栏看到这个标题。
在<body>和</body>之间的信息，是正文。
在<b>和</b>之间的文字，用粗体表示。<b>顾名思义，就是bold的意思。
HTML文件看上去和一般文本类似，但是它比一般文本多了Tag，比如<html>，<b>等，通过这些Tag，可以告诉浏览器如何显示这个文件。
HTML元素(HTML Elements)
∙ HTML元素(HTML Element)用来标记文本，表示文本的内容。比如body, p, title就是HTML元素。 
∙ HTML元素用Tag表示，Tag以<开始，以>结束。
∙ Tag通常是成对出现的，比如<body></body>。起始的叫做Opening Tag，结尾的就叫做Closing Tag。
∙ 目前HTML的Tag不区分大小写的。比如，<HTML>和<html>其实是相同的。
HTML元素(HTML Elements)的属性
HTML元素可以拥有属性。属性可以扩展HTML元素的能力。
比如你可以使用一个bgcolor属性，使得页面的背景成为红，就像这样：
<body bgcolor="red">
再比如，你可以使用border这个属性，将一个表格设成一个无边框的表格。如下：
<table border="0">
 
属性通常由属性名和值成对出现，就像这样：name="value"。上面例子中的bgcolor, border就是name，red和0就是value。属性值一般用双引号标记起来。
属性通常是附加给HTML的Opening Tag，而不是Closing Tag
链接。
<html>
<body>
<p>
<a href="../asdocs/html_tutorials/humor02.html">这是一个链接</a>
</p>
<p>
<a href="www.admin5/html" target=_blank>站长网 站长学院站点链接</a>
</p>
</body>
</html>
HTML相对路径(Relative Path)
同一个目录的文件引用
如果源文件和引用文件在同一个目录里，直接写引用文件名即可。
我们现在建一个源文件info.html，在info.html里要引用index.html文件作为超链接。
假设info.html路径是：c:\Inetpub\wwwroot\sites\blabla\info.html
假设index.html路径是：c:\Inetpub\wwwroot\sites\blabla\index.html
在info.html加入index.html超链接的代码应该这样写：
<a href = "index.html">index.html</a>
创建html文件
 
如何表示上级目录
../表示源文件所在目录的上一级目录，../../表示源文件所在目录的上上级目录，以此类推。
假设info.html路径是：c:\Inetpub\wwwroot\sites\blabla\info.html
假设index.html路径是：c:\Inetpub\wwwroot\sites\index.html
在info.html加入index.html超链接的代码应该这样写：
<a href = "../index.html">index.html</a>
假设info.html路径是：c:\Inetpub\wwwroot\sites\blabla\info.html
假设index.html路径是：c:\Inetpub\wwwroot\index.html
在info.html加入index.html超链接的代码应该这样写：
<a href = "../../index.html">index.html</a>
假设info.html路径是：c:\Inetpub\wwwroot\sites\blabla\info.html
假设index.html路径是：c:\Inetpub\wwwroot\sites\wowstory\index.html
在info.html加入index.html超链接的代码应该这样写：
<a href = "../wowstory/index.html">index.html</a>
 
如何表示下级目录
引用下级目录的文件，直接写下级目录文件的路径即可。
假设info.html路径是：c:\Inetpub\wwwroot\sites\blabla\info.html
假设index.html路径是：c:\Inetpub\wwwroot\sites\blabla\html\index.html
在info.html加入index.html超链接的代码应该这样写：
<a href = "html/index.html">index.html</a>
假设info.html路径是：c:\Inetpub\wwwroot\sites\blabla\info.html
假设index.html路径是：c:\Inetpub\wwwroot\sites\blabla\html\tutorials\index.html
在info.html加入index.html超链接的代码应该这样写：
<a href = "html/tutorials/index.html">index.html</a>
HTML绝对路径(Absolute Path)
HTML绝对路径(absolute path)指带域名的文件的完整路径。
假设你注册了域名www.admin5/html，并申请了虚拟主机，你的虚拟主机提供商会给你一个目录，比如www，这个www就是你网站的根目录。
假设你在www根目录下放了一个文件index.html，这个文件的绝对路径就是： www.admin5/html。
假设你在www根目录下建了一个目录叫html_tutorials，然后在该目录下放了一个文件index.html，这个文件的绝对路径就是www.admin5/html/html_tutorials/index.html
HTML图片(Images)
用 <img> 这个 Tag 可以在HTML里面插入图片。最基本的语法如下：
<img src="url">
url表示图片的路径和文件名。比如 url 可以是 images/logo/blabla_logo01.gif，也可以是个相对路径 "../images/logo/blabla_logo01.gif"。
示例
图片alt属性
<img>中有一个alt属性，英文叫alternate text。例句如下：
<img src = "../images/html_tutorials/smile.jpg" alt="smile face">
假使浏览器没有载入图片的功能，浏览器就会转而显示Alt属性的值。
其实，现在大多数浏览器都支持图片载入。在此介绍Alt属性，是因为它的另外一个重要功能。目前搜索引擎抓取工具无法识别图像中所含的文字，所以用ALT属性写上图片的说明，便于搜索引擎抓取你网页的内容。
示例
图片align属性
用align属性，可以改变图片的垂直(居上、居中、居下)对齐方式和水平对齐方式(居左、居中、居右)。
示例
图片的大小
在缺省状况下，图片显示原有的大小。你可以用height和width属性改变图片的大小。不过图片的大小一旦被改变，图片会相应放大或缩小，显示出来的结果可能会很难看。
示例
建议
图片相对文字，所占的字节数较多，比如一个全屏的图片，即使经过压缩，也要占去大约50k字节，这相当于25000字的文本。因此浏览器载入图片比较费时，建议一个HTML文件里不要包含过多的图片，否则会影响你的网页显示速度。
更多示例
背景图片
这个示例演示如何将一个图片作为HTML网页的背景图片。
将一个图片作为一个超链接
这个示例演示了如何将一个图片作为一个超链接，即点击一个图片，可以连接到其它文件。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。