HTML教程html教程下载-HTML基础教程
更多的HIML教程尽在htp:/
段落划分
在HTML里用<p>和</p>划分段落。
p>This is a paragraph</p>
<p>This is another paragraph</p>
换行
通过使用<br>这个Tag,可以在不新建段落的情况下换行。<br>没有 Closing Tag
用<p>换行是个坏习惯，正确的是使用<br>。
I <p>This <br> is a para<br>graph with line breaks</p>
HTML注释
在HTML文件里，你可以写代码注释，解释说明你的代码，这样有助于你和他人日后能够
更好地理解你的代码。
注释可以写在<!-和->之间。浏览器是忽略注释的，你不会在HTML正文中看到你的注
释
1<!- This is a comment-→
一些小建议
HTML文件会自动截去多余的空格。不管你加多少空格，都被看做一个空格。一个空行也
被看做一个空格。
有些Tag能够将文本自成一段，而不需要使用<p></p>来分段。比如<h1></h1>之类
的标题Tag。
更多
<html>
<body>
p
这一段在源代码里包含很多分行，但是浏览器忽略这些分行。
</p>
<p>
这一段
在浏览器里
包含很多空格，
但是浏览器忽略多余空格。
</p>
p
你使用的浏览器的窗口大小决定了段落的行数。如果你改编浏览器窗口的大小，段落的行数
会因此改变。
</p>
/ body
</html>
这个显示了段落的特性。
<htmI>
<body>
第3页共20页——友情赞助htp/
更多的HIML教程尽在htp:/
<p>
要<br>在一段<br>里<br>换行<br>请使用<br>br这个Tag。
/p>
</body>
</html>
这个告诉你如何在HTML文件里换行。
<html>
<body>
<h1>这是1号标题</h1>
<h2>这是2号标题</h2>
<h3>这是3号标题</h3>
<h4>这是4号标题</h4>
<h5>这是5号标题</h5>
<h6>这是6号标题</h6>
/bo
</html>
这个教会你如何在HTML文件里显示正文标题。
<html>
<body>
<h1 align=" center">这是标题</h1>
p>上面的标题是居中显示的。</p>
</body
</html>
这个告诉你如何将正文标题居中显示。
<html>
<body>
<p>用hr这个Tag可以在HTML文件里加一条横线。</p>
<hr>
<p>村妇想像阜宫的生活：皇后得用金扁担挑水吧。</p>
<hr>
<p>问：谁是世界上最可怜的人？答：炮兵连炊事班战士！问：为什么？答：戴绿帽背黑
锅看别人打炮。</p>
<hr>
<p>初中某数学老师讲方程式变换，在讲台上袖子一挽大声喝道：同学们注意！我要变形
/ body
</html>
这个演示了如何在HTML文中加条横线。
第4页共20页——友情赞助htp/
更多的HIML教程尽在htp:/
<html>
<body>
<!--这是代码注释-->
<p>代码注释是不会显示在网页里的。</p>
</ body
</html>
这个演示如何在HTML代码中加上代码注释，这些注释只显示在HTML源代码中，而源代
码最终形成的网页里是看不到这些注释的。
shtml>
< body bgcolor="yellow>
<h2>看，这个页面是黄色的。</h2>
</body
</html>
这个演示如何改变HTML文件的背景色。
HTML常用格式
HTML定义了一些文本格式的Tag,比如利用Tag,可以将字体变成粗体或者斜体。从下
面的，你可以了解各种文本格式Tag如何改变HTML文本的显示。
常用文本格式Tag
1ag
Tag说明
粗体bod
<|>
斜体taic
<d>
文字当表示珊除
<InS>
文字下划线表小插入
sub>
下标
< blockquote>缩进表示小引用
保留空格不换行
<ade>
表小计算机码等
<htm>
<body
第5页共20页——友情赞助htp/
更多的HIML教程尽在htp:/
<p><b>粗体用b表示。</b></p>
p><>斜体用i表示。</i></p>
<p><de>芙蓉姐姐</del>这个词当中划线表示删除。</>
<p><ins>想唱就唱</ins>这个词下划线插入。</p>
<p>X<sub>2</sub>其中的2是下标</p>
<p>X<sup>2</sup>其中的2是上标</p>
<p>< blockquote>好好学习，天天向上。这句话缩进表示引用</ blockquote></p>
≤pre>
这是
预设（ preformatted）文本
在pre这个tag里的文本保留
空格和
分行。
</pre>
<code>call getorders</code>
<p>用code显示计算机代码，code里显示的字符是等宽字符。</p>
</body>
</html>
这个用了上述Tag,你可以对比一下HTML的显示结果。
如何看HTML的源代码
在浏览器看到的HTML网页，是浏览器解释HTML源代码后产生的结果。
要查看这个HTML的源代码，有两种方法。一是点击鼠标右键，点击 ew source（查看
源文件）命令;二是选择浏览器菜单view（查看〕中的 Source（源文件）命令。
利用 ew source得到网页的源代码，你可以由此借鉴一下别人写得好的地方。不过在你
对HTML知识尚少的情况下，看别人复杂的HTML源代码，只会让你头晕。建议你还是再
等等，先掌握一些基础再说
HTML特殊字符显示
HTML字符实体（ Character EntItles）
有些字符在HTML里有特别的含义，比如小于号<就表示 HTML Tag的开始，这个小于号
是不显示在我们最终看到的网页里的。那如果我们希望在网页中显示一个小于号，该怎么办
呢？
这就要说到HTML字符实体（ HTML Character Entities）了。
个字符实体（ Character Entity）分成三部分：第一部分是一个&符号，英文叫
ampersand;第二部分是实体（ Entity）名字或者是#加上实体（ Entity）编号;第三部分是
一个分号。
比如，要显示小于号，就可以写&t;或者<。
用实体（Entt）名字的好处是比较好理解，一看t,大概就猜出是 less than的意思，但是
其劣势在于并不是所有的浏览器都支持最新的 Entity名字。而实体（ Entity）编号，各种浏
览器都能处理。
注意： Entity是区分大小写的。
第6页共20页——友情赞助htp/
更多的HIML教程尽在htp:/
如何显示空格
通常情况下，HTML会自动截去多余的空格。不管你加多少空格，都被看做一个空格。比如
你在两个字之间加了10个空格，HTML会截去9个空格，只保留一个。为了在网页中增加
空格，你可以使用 表示空格
最常用的字符实体（ Character Entitles
显示结果说明
Enuty Name Enuty Number
显示个辂& nbsp
8#160
小于
8:#60
<>&
大于
8#62
8符号
Bam
#38
观8q;
8#
其他常用的字符实体（ Character Entitles）
显示结果说明 Enuty Name Entity Numbe
版权8cpv
8#169
③注册摘标8eg
8#174;
乘号8ms;
8#215;
÷
除号8dvde;
8#2
更多字符实体 Character entities）
更多字符实体（ Character entities）请参见。
HTML利用超链接打开链接文件
先看两个
<html>
<body>
p
< a href=" asdoc/ html tutorials/ humor02htm">这是一个链接</a>
</p>
p
<ahref=""target=blank站长网站长学院站
点链接</a>
/D>
</body>
</html>
这个演示了如何在HTML文件里创建超链接。
第7页共20页——友情赞助htp/
更多的HIML教程尽在htp:/
<html>
<body>
≤p>
你可以将一张图片作为一个链接，点击这个图片。
<a href="/ asdoc/html tutorials/humor03 html"><img
src=" tutorials/smile jpg"></a>
/p>
/body
</html>
这个演示了如何将一个图片作为一个超链接，即点击一个图片，可以连接到其它文件。
a和href属性
HTML用<a>来表示超链接，英文叫 anchor。
a>可以指向任何一个文件源：一个HTML网页，一个图片，一个影视文件等。用法如下：
< a href"ur”）链接的显示文字/a》
点击<a></a>当中的内容，即可打开一个链接文件，href属性则表示这个链接文件的路
径
比如链接到站点首页，就可以这样表示：
Kahref=">站长网站长学院
首页</a>
target属性
使用 target属性，可以在一个新窗口里打开链接文件。
<ahref=""target=blank站长网站长学院
首页</a>
<html>
<body>
<ahef=",/ asdoc/ html tutorials/ humor01htm" target="bank">一则笑话
</a>
p
如果你将 target的属性值设成 blank,你点击这个链接的时候，网页就会在一个新窗口出
现
/p>
</ body
</html>
ttle属性
使用tite属性，可以让鼠标悬停在超链接上的时候，显示该超链接的文字注释。
ahref="title="站长网站长学院网页教程与
弋码的中文站点">站长网站长学院网站</a>
如果希望注释多行显示，可以使用
作为换行符
Kahref="title="站长网站长学院#10;网页
教程与代码的中文站点">站长网站长学院网站</a>
第8页共20页——友情赞助htp/
更多的HIML教程尽在htp:/
<html>
<body>
P>
<ahref="title站长网站长学院网页教程与代
码的中文站点">站长网站长学院网站</a>
/p>
<p>
<ahref="title站长网站长学院&#t10.网页
教程与代码的中文站点">站长网站长学院网站</a>
</p>
</body>
</html>
name属性
使用name属性，可以跳转到一个文件的指定部位。
使用name属性，要设置一对。一是设定name的名称，二是设定一个href指向这个name:
< e href="#C1">参见第章</a>
a name="C1">第章</a>
name属性通常用于创建一个大文件的章节目录（ table of contents）。每个章节都建立
个链接，放在文件的开始处，每个章节的开头都设置Name属性。当用户点击某个章节的
链接时，这个章节的内容就显示在最上面。
如果浏览器不能找到Name指定的部分，则显示文章开头，不报错
链接到ema地址
在网站中，你经常会看到联系我们的链接，一点击这个链接，就会触发你的邮件客户端，
比如 Outlook Express,然后显示一个新建mai的窗口。用<a>可以实现这样的功能。
< a href=" mailto:info@sinacm"联系新浪/a>
HTML相对路径（ Relative Path）和绝对路径（ Absolute Path）
HTML初学者会经常遇到这样一个问题，如何正确引用一个文件。比如，怎样在一个HTML
网页中引用另外一个HTML网页作为超链接（ hyperlink）？怎样在一个网页中插入一张图
片？
如果你在引用文件时（如加入超链接，或者插入图片等），使用了错误的文件路径，就会导致
引用失效（无法浏览链接文件，或无法显示插入的图片等）
为了避免这些错误，正确地引用文件，我们需要学习一下HTML路径
HTML有2种路径的写法：相对路径和绝对路径。
HTML相对路径（ Relative path）
同一个目录的文件引用
如果溟文件和引用文件在同一个目录里，直接写引用文件名即可。
我们现在建一个源文件 info htm,在info.htm里要引用 index. html文件作为超链接。
第9页共20页——友情赞助htp/
更多的HIML教程尽在htp:/
假设 info. html路径是：c: netpub\ sitesblabla info html
假设 index. html路径是：c:\ Inetpub\ sitesblabla index. html
在 info. htm加入 index. htn|超链接的代码应该这样写：
<a href="index. html">index. html</a>
如何表示上级目录
/表示源文件所在目录的上一级目录，/表示源文件所在目录的上上级目录，以此类推。
假设 info. htm|路径是：c: Inetpub b| abla \ info html
假设 index. htn路径是：c:\ Inetpub\ sites\index. html
在 info, htn加入 index. htm超链接的代码应该这样写：
<a href=" html">index. html</a>
假设 info. html路径是：c: netpub\ blabla \info. html
假设 index. html路径是：c: \Inetpub\ html
在 info. htm加入 index htn超链接的代码应该这样写：
<a href=" htm1">index. html</a>
假设info.htm|路径是：c: netpub\ sites\ blabla \info.html
假设 index. html路径是：c: netpub\ sites\wowstory\index. htm
在 info, htn加入 index, htn|超链接的代码应该这样写：
I <a href="">index htm1</a>
如何表示下级目录
引用下级目录的文件，直接写下级目录文件的路径即可。
假设info.htm|路径是：c:\ Inetpub\ sites\ blabla info.html
假设 index. htm路径是：c: netpub\ blablahtmN index html
在 info. htm加入 index. htm超链接的代码应该这样写：
<a href="html/index. html">index. html</a>
假设 info. htm路径是：c:\ Inetpub\ sites（ info. html
假设 index. ht路径是：
c:\Inetpub \ tutorials\index. html
在 info. htm加入 index. htm|超链接的代码应该这样写：
<a href="html/tutorials/index. html">index. html</a>
HTML绝对路径（Abs。 ute Path）
HTML绝对路径（ absolute path）指带域名的文件的完整路径。
假设你注册了域名并申请了虚拟主机，你的虚拟主机提供
商会给你一个目录，比如www,这个WWw就是你网站的根目录。
如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html/h59924.shtml
