HTML基本概念Word下载.docx

1、之间的文字，用粗体表示。b 顾名思义，就是bold的意思。HTML文件看上去和一般文本类似，但是它比一般文本多了Tag，比如，等，通过这些Tag，可以告诉浏览器如何显示这个文件。HTML元素 （HTML Elements）HTML元素（HTML Element）用来标记文本，表示文本的内容。比如body, p, title就是HTML元素。HTML Element）用来标记文本，表示文本的内容。HTML元素用Tag表示，Tag以结束 。Tag通常 是成对出现的，比如 起始的叫做Opening Tag，结尾的就叫做Closing Tag 。html。属性可以扩展HTML元素的能力。HTML元素。

2、目前HTML的Tag不区分大小写的。比如，其实是相同的。HTML元素（HTML Elements）的属性之间的信息 ，HTML元素可以拥有属性。属性可以扩展HTML元素的能力 。之间的信息 ，是正文。Element！比如你可以使用一个bgcolor属性，使得页面的背景色成为红色，就像这样：body bgcolor=red再比如，你可以使用border这个属性，将一个表格设成一个无边框的表格。如下 ：table border=0 属性通常由属性名和值成对出现 ，就像这样：name=value上面例子中的bgcolor, border就是name，red和0就是value。属性值一般用双引号标记起

3、来。属性通常是附加给HTML的Opening Tag，而 不是Closing Tag。一些基础的HTML TagHTML里，比较基础的Tag主要用于标题，段落和分行。学习HTML最好的方法，就是跟着示例学。为了各位学习的方便，我们准备了一个简单的HTML编辑器，你可以 在左边写HTML代码 ，然后点击上面的按钮，查看HTML的显示结果 。试试看吧！示例：一个非常简单的HTML文件这个示例算是一个最简单的HTML文件，只包含了最基本的能构成一个HTML文件的Tag。通过这个例子，你可以看到浏览器是如何显示这个文件的，以此对HTML文件有个最初的认识。简单的段落这个示例显示在HTML文件里如何分段

4、。正文标题居中的正文标题 正文标题。这个示例告诉你如何在HTML文件里定义正文标题。这个示例演示如何改变HTML文件的背景色。HTML用到这几个Tag来定义正文标题，从大到小。每个正文标题自成一段。This is a headingh2/h2 h3/h3 h4/h4h5/h5 /h6段落划分简单的段落 这个示例显示了段落的特性。在HTML里用/p划分段落。This is a paragraphThis is another paragraph换行通过使用 这个Tag，可以在不新建段落的情况下换行。没有Closing Tag。用换行是个坏习惯，正确的是使用This is a paragraph

5、with line breaksHTML注释在HTML文件里，你可以写代码注释，解释说明你的代码，这样有助于 你和他人日后能够更好地理解你的代码。注释可以写在之间。浏览器 是忽略注释的，你不会在HTML正文中看到你的注释。- This is a comment -一些小建议HTML文件会自动截去多余的空格。不管你加多少空格，都被看做一个空格。 一个空行也被看做一个空格。有些Tag能够将文本自成一段 ，而不需要使用/p 来分段。比如斜体italic del文字当中划线表示删除 ins文字下划线表示插入 sub下标 sup上标 blockquote缩进表示引用pre保留空格和换行 code 表示计

6、算机代码，等宽字体 示例HTML常用的格式Tag这个示例用了上述Tag，你可以对比一下HTML的显示结果。如何看HTML的源代码在浏览器看 到的HTML网页，是浏览器解释HTML源代码后产生的结果。要查看这个HTML的源代码，有两种方法。一是点击鼠标右键，点击View Source（查看源文件）命令；二是选择浏览器菜单View（查看）中的Source（源文件）命令。利用View Source得 到网页的源代码，你可以由此借鉴一下别人写得好的地方。不过在你对HTML知识尚少的情况下，看别人复杂的HTML源代码，只会让你头晕。建议你还是再等等，先掌握一些基础再说。HTML特殊字符显示HTML字符实

7、体（Character Entities）有些字符 在HTML里有特别的含义，比如小于号来表示超链接，英文叫anchor。可以指向任何一个文件源：一个HTML网页，一个图片，一个影视文件等 。用法如下 ：a href=url 链接的显示文字如果希望注释多行显示，可以使用 。点击当中的内容，即可打开一个链接文件，href属性则表示这个链接文件的路径。比如链接到站点首页，就可以这样表示： 布啦布啦首页title属性使用 title 属性，可以让鼠标悬停在超链接上的时候，显示该超链接的文字注释 。http :/ title = 布啦布啦网页教程与代码的中文站点 布啦布啦网站使用target属性 ，可

8、以在一个新窗口里打开链接文件？如果希望注释多行显示，可以使用 作为换行符。布啦布啦&网页教程与代码的中文站点name属性使用name属性，可以跳转到一个文件的指定部位。使用name属性，要设置一对。一是设定name的名称，二是设定一个href指向这个name：#C1 参见第一章a name=C1第一章name属性通常用于创建一个大文件的章节目录（table of contents）。每个章节都建立一个链接，放在文件的开始处，每个章节的开头都设置Name属性。当用户点击某个章节的链接时，这个章节的内容就显示 在最上面。如果浏览器不能找 到Name指定的部分，则显示文章开头，不报错。链接

9、到email地址就可以这样表示：示例 这个示例演示了如何在HTML文件里创建超链接。在网站中，你经常会看到联系我们的链接，一点击这个链接，就会触发你的邮件客户端 ，比如Outlook Express，然后显示一个新建mail的窗口。可以实现这样的功能。a href = mailto:info联系新浪 HTML相对路径（Relative Path）和绝对路径（Absolute Path）HTML初学者会经常遇到这样一个问题，如何正确引用一个文件。比如，怎样在一个HTML网页中引用另外一个HTML网页作为超链接（hyperlink）？怎样在一个网页中插入一张图片？ .（相关教程：HTML超链接 ；

10、HTML图片）种路径的写法：相对路径和绝对路径。假设info.html路径是。如果你在引用文件时（如加入超链接，或者插入图片等 ），使用了错误的文件路径 ，就会导致引用失效 （无法浏览链接文件，或无法显示插入的图片等）。为了避免这些错误，正确地引用文件，我们需要学习一下HTML路径。HTML有2种路径的写法：HTML相对路径（Relative Path）同一个目录的文件引用html超链接的代码应该这样写 ：c:Inetpub。如果源文件和引用文件在同一个目录里 ，直接写引用文件名即可。我们现在建一个源文件info.html，在info .html里要引用index.html文件作为超链接。表示

11、源文件所在目录的上一级目录，.。假设info.html路径是：Inetpubwwwrootsitesblablainfo.html假设index.html路径是：Inetpubwwwrootsitesblablaindex.htmlhtml文件作为超链接。Inetpubwwwroot.在info.html加入index.html超链接的代码应该这样写：index.htmlindex.html 如何表示上级目录./表示源文件所在目录的上一级目录 ，././表示源文件所在目录的上上级目录，以此类推。Inetpubwwwrootsitesindex.html在info.html加入index .ht

12、ml超链接的代码应该这样写 ：./index.htmlindex.html假设index .html路径 是：c :Inetpubwwwrootindex.html在info.html加入index.html超链接的代码应该这样写././index.html假设info.html路径 是：Inetpubwwwrootsiteswowstoryindex.htmlhtml路径 是：Inetpubwwwrootsites./wowstory/index.html如何表示下级目录引用下级目录的文件，直接写下级目录文件的路径即可。Inetpubwwwrootsitesblablahtmlindex.h

13、tmlhtml/index.html假设info .html路径是：Inetpubwwwrootsitesblablahtmltutorialsindex.html在info .html加入index.html超链接的代码应该这样写：html/tutorials/index .htmlindex .htmlHTML绝对路径（Absolute Path）HTML绝对路径（absolute path）指带域名的文件的完整路径。表示源文件所 在目录的上上级目录，以此类推。正确地引用文件，我们需要学习一下HTML路径。假设你注册了域名，并申请了虚拟主机，你的虚拟主机提供商会给你一个目录，比如www，这

14、个www就是你网站的根目录。假设你在www根目录下放了一个文件index.html，这个文件的绝对路径就是：.html，这个文件的绝对路径就是http:/www！假设你在www根目录下建了一个目录叫html_tutorials，然后 在该目录下放了一个文件index.html，这个文件的绝对路径就是http :/www.blabla .cn/html_tutorials/index .html。如何创建HTML表格HTML表格用表示 。一个表格可以分成很多行 （row ），用表示；每行又可以分成很多单元格 （cell ），用表示。这三个Tag是创建表格最常用的Tag。border属性在缺省情况

15、下，如果不设置表格的边界，表格是不显示边界的 。不显示边界的表格要显示表格的边界，可使用b order这个属性 。显示边界的表格表格的表头th来表示表格的表头，表头的字是粗体显示的。图片，超链接，Form，表格等。 有表头的表格空的单元格如果表格的单元格之间没有内容，那么这个单元格的边界是不会被显示出来的，尽管整个表格已设置边界值。要显示这个单元格的边界，可以插入一个&空格符。有标题的表格这个示例演示如何用在一个表格上加上标题 。包含多列或多行的单元格这个示例演示如何用colspan，rowspan设置多列或者多行的单元格。单元格里的内容这个例子演示单元格/frameset决定如何划分Fram

16、e。有cols属性和rows属性。使用cols属性，表示按列分布Frame ；使用rows属性，表示按行分布Frame。Frameframe 这个Tag设定网页。frame里有src属性，src值就是网页的路径 和文件名。下面的代码的目的是：将Frameset分成2列，第一列25%，表示第一列的宽度是窗口宽度的25% ；第二列75%，表示第一列的宽度是窗口宽度的75%。第一列中显示a.html，第二列中显示b.html。frameset cols=25%,75% frame src=./asdocs/html_tutorials/Frame_a.html./asdocs/html_tutori

17、als/Frame_b.html/frameset IframeIframe是Inline Frame的意思 ，用/iframe可以将Frame置于一个HTML文件内。列分Frame这个例子显示如何在浏览器里同时显示三个网页，三个网页 是按列分布的。行分Frame这个例子显示如何在浏览器里同时显示三个网页，三个网页是按行分布的。混合Frameset这个例子显示如何在一个HTML文件里用iframe嵌入一个网页。这个例子既用到了cols属性，又用到了rows属性，将Frame进行灵活分布。Frameset中的noresize属性使用Noresize属性可以确保Frame的大小。如果不使用noresize属性 ，你可以用鼠标移动Frame的边界，来改变Frame的大小，如果设置了nore