HTML标签以及各个标签属性大全（网页制作必备）

标签：  杂谈

分类： 网页制作学习过程

   取消换行 和
相反

 

总类（所有HTML文件都有的）

--------------------------------------------------------------------------------

文件类型       （放在档案的开头与结尾）

文件主题    （必须放在「文头」区块内）

文头           （描述性资料，像是「主题」）

文体           （文件本体）

 

结构性定义（由浏览器控制的显示风格）

--------------------------------------------------------------------------------

标题  （？表示从1到6，有六层选择） 数值越高字越小

标题对齐   左对齐、居中对齐、右对齐

 

区分 

区分对齐 

 左对齐、右对齐、居中对齐、两端对齐

 

引文区块 

 （通常会内缩）

 

斜体 

 

加粗 

 

引文  （通常会以斜体显示）

 

码  （显示原始码之用）

 

样本 

表示一段用户应该对其没有什么其他解释的文本。要从正常的上下文抽取这些字符时，通常要用到这个标签。

并不经常使用，只在要从正常上下文中将某些短字符序列提取出来，对其加以强调，才使用这个标签

 

键盘输入 

 

变数 

 

定义  （有些浏览器不提供）

 

地址 

 

3.0 大字 

 

3.0 小字 

 

与外观相关的标签（作者自订的表现方式）

--------------------------------------------------------------------------------

加粗 

 

斜体 

 

3.0 底线  （尚有些浏览器不提供）

 

3.0 删除线 （尚有些浏览器不提供）

 

3.0 下标

 

3.0 上标

 

打字机体  （用单空格字型显示）

 

预定格式 

 （保留文件中空格的大小）

 

预定格式的宽度 

（以字元计算）

 

N1.0+ 向中看齐 

 （文字与图片都可以）

 

N1.0 闪耀  （有史以来最被嘲弄的标签）

 

N1.0 字体大小 （从1到7）

 

N1.0 改变字体大小 

 

N1.0 基本字体大小  （从1到7; 内定为3）

 

N2.0 字体颜色 

 

连结与图形

--------------------------------------------------------------------------------

链接   

 

连结到锚点 （如果锚点在另一个档案）

           （如果锚点目前的档案）

 

N2.0 连结到目的视框 

 

设定锚点 

 

图形 <IMG SRC="URL">

 

图形看齐方式  

 

N1.0 图形看齐方式 

 

取代文字 （如果没有办法显示图形则显示此文字）

 

点选图  （需要CGI程式）

 

N2.0 点选图

 

N2.0 地图 （描述地图）

 

N2.0 段落

 

3.0 大小 （以pixels为单位：px）

 

N1.0 图形边缘 （以pixels为单位）

 

N1.0 图形边缘空间 （以pixels为单位）

 

N1.0 低解析度图形

 

N1.1 用户端拉 （使用端自动更新 ）

 

N2.0 内嵌物件 （将物件插入页面）

 

N2.0 内嵌物件大小

 

分隔

-------------------------------------------------------------------------------- 

段落

（通常是两个return）

 

3.0 段落

（新定义成容器型标签）

 

3.0 文字看齐方式

 

换行
（一个return）

 

N1.0 文字部份看齐方式
（与图形合用时）

 

横线

---

 

N1.0 横线对齐

---

 

N1.0 横线厚度

---

（以pixels为单位）

 

N1.0 横线宽度

---

（以pixels为单位）

 

N1.0 横线比率宽度

---

（以页宽为100%）

 

N1.0 实线

---

（没有立体效果）

 

N1.0 不可换行 （不换行）

 

N1.0 可换行处 （如果需要，可在此断行）

 

列举 （可以巢状列举）

--------------------------------------------------------------------------------

无次序式列举 

 （

放在每一项前）

 

N1.0 公布式列举

（定义全部的列举项）

 

• （定义这个及其後的列举项）

   

  有次序式列举 

   （
• 放在每一项前）

   

  N1.0 数标型态

  （定义全部的列举项）

   

  1. （定义这个及其後的列举项）

      

     N1.0 起始数字

     （定义全部的列举项）

      

     1. （定义这个及其後的列举项）

         

        定义式列举

        （
        项目,
        定义）

         

        表单式列举

        （

        放在每一项前）

         

        目录式列举

        （

        放在每一项前）

         

        背景与颜色

        --------------------------------------------------------------------------------

        3.0 重复排列的背景

         

        N1.1+ 背景颜色 （依序为红、绿、蓝）

         

        N1.1+ 文字颜色

         

        N1.1+ 连结颜色

         

        N1.1+ 看过的连结

         

        N1.1 使用中的连结

         

        特殊字元（以下标签需用小写）

        -------------------------------------------------------------------------------- 

        特别符号 &#?; （其中 ? 代表 ISO 8859-1 的编码）

         

        < < > > & & " "

         

        注册商标TM ?

         

        N1.0+ 注册商标TM ®

         

        著作权符号 ?

         

        N1.0+ 著作权符号 ©

         

        表单 （通常需要与CGI程式配合）

        --------------------------------------------------------------------------------

        定义表单

         

        N2.0 上传档案

         

        输入栏位

         

        栏位名称

         

        栏位内定值

         

        已选定 （适用於checkboxes与 radio boxes）

         

        栏位宽度 （以字元数为单位）

         

        最长字数 （以字元数为单位）

         

        下拉式选单

         

        下拉式选单名称

         

        选单项目数量

         

        多选式选单 （多选）

         

        选项

         

        内定选项

         

        文字输入区

         

        输入区名称

         

        N2.0 输入区换行方式

         

        表格

        --------------------------------------------------------------------------------

        3.0 定义表格

         

        3.0 表格框线

        （有或没有）

         

        N1.1 表格框线

        （可以设定数值）

         

        N1.1 储存格左右留白

         

        N1.1 储存格上下留白

         

        N1.1 表格宽度

        （以pixels为单位）

         

        N1.1 宽度比率

        （页宽为100%）

         

        3.0 表格列 

         

        3.0 表格列内容看齐

         

        3.0 储存格 

         （须与列并用）

         

        3.0 储存格内容看齐

        （跟

         

        3.0 表格抬头看齐

         这三个标签的层次结构：

         

        （在表格之上/之下）

         

        视框 （定义与控制萤幕上的特定区域）

        --------------------------------------------------------------------------------

        N2.0 视框格式总定义 （取代）

         

        N2.0 视框行长度分配 （pixels 或 %）

         

        N2.0 视框行长度分配 （* = 相对大小）

         

        N2.0 视框栏宽度分配 （pixels 或 %）

         

        N2.0 视框栏宽度分配 （* =相对大小）

         

        N2.0 定义个别视框 （定义个别视框）

         

        N2.0 个别视框内容

         

        N2.0 个别视框名称

         

        N2.0 边缘宽度 （「左」与「右」边界）

         

        N2.0 边缘高度 （「天顶」与「地底」边界）

         

        N2.0 卷动条

         

        N2.0 不可改变大小

         

        N2.0 无视框时的内容 （如果浏览器不提供视框功能的话）

         

        杂项

        --------------------------------------------------------------------------------

        说明 （浏览器不会显示）

        档案型态声明

        3.0 档案型态声明

        可搜寻 （指示可搜寻的索引项）

         

        N1.0 提示 （要求输入的提示文字）

         

        送出搜寻条件 （其中的问号不是数字，而是「问号」）

         

        基本档案的URL （必须放在「文头」区段内）

         

        N2.0 基本视窗名称 （必须放在「文头」区段内）

         

        相关性 （必须放在「文头」区段内）

         

        背景资讯 （必须放在「文头」区段内）

         

         

         

         

         

        HTML标签

        HTML标签通常是英文词汇的全称（如块引用:blockquote）或缩略语（如“p”代表Paragragh），但它们的与一般文本有区别，因为它们放在单书名号里。故Paragragh标签是

        ,块引用标签是

        。有些标签说明页面如何被格式化（例如，

        开始一个新段落），其他则说明这些词如何显示(使文字变粗)还有一些其他标签提供在页面上不显示的信息－－例如标题。

         

        关于标签，需要记住的是，它们是成双出现的。每当使用一个标签－－如

        ,则必须以另一个标签

        将它关闭。注意“blockquote”前的斜杠，那就是关闭标签与打开标签的区别。

        基本HTML页面以标签开始，以结束。在它们之间，整个页面有两部分－－标题和正文。

         

        标题词－－夹在和标签之间－－这个词语在打开页面时出现在屏幕底部最小化的窗口。正文则夹在和之间－－即所有页面的内容所在。页面上显示的任何东西都包含在这两个标签之中。

         

        那么让我们建立一个简单的范例吧，非常容易的。第一步，当然是要建立一个新的文本文件（记住，如果你在使用比较复杂的文字处理器，就应该用“纯文本”或“普通文本”来保存），将它命名为“xxxx.html”。(随便你起一个什么名字,但记住,要用英文)

         

        然后你可以用浏览器将它打开，你会看见最简单的自己做的页面。

         

        .

        2.

        3.

        4.

         

        Html是英文 HyperText Markup Language 的缩写，中文意思是“超文本标志语言”，用它编写的文件(文档)的扩展名是.html或.htm，它们是可供浏览器解释浏览的文件格式。您可以使用记事本、写字板或 FrontPage Editor 等编辑工具来编写Html文件。Html语言使用标志对的方法编写文件，既简单又方便，它通常使用<标志名>来表示标志的开始和结束(例如标志对)，因此在Html文档中这样的标志对都必须是成对使用的。在此教程中，我先讲一下Html的基本标志：

         

        1.

        标志用于Html文档的最前边，用来标识Html文档的开始。而标志恰恰相反，它放在Html文档的最后边，用来标识Html文档的结束，两个标志必须一块使用。

         

        2.

        和构成Html文档的开头部分，在此标志对之间可以使用、等等标志对，这些标志对都是描述Html文档相关信息的标志对，标志对之间的内容是不会在浏览器的框内显示出来的。两个标志必须一块使用。

         

        3.

        是Html文档的主体部分，在此标志对之间可包含

        、

        、

        、

        、
        、

        ---

        等等众多的标志，它们所定义的文本、图像等将会在浏览器的框内显示出来。两个标志必须一块使用。标志中还可以有以下属性：属性

        用途

        示例

         

        设置背景颜色。 红色背景

        设置文本颜色。 蓝色文本

        设置链接颜色。 链接为蓝色

        设置已使用的链接的颜色。

        设置正在被击中的链接的颜色。

        说明:以上各个属性可以结合使用，如。引号内的rrggbb是用六个十六进制数表示的RGB(即红、绿、蓝三色的组合)颜色，如#ff0000对应的是红色。此外，还可以使用Html语言所给定的常量名来表示颜色：Black、White、Green、Maroon、Olive、Navy、Purple、Gray、Yellow、Lime、Agua、Fuchsia、Silver、Red、Blue和Teal，如表示标志对中的文本使用蓝色显示在浏览器的框内。

         

        4.

        使用过浏览器的人可能都会注意到浏览器窗口最上边蓝色部分显示的文本信息，那些信息一般是网页的“主题”，要将您的网页的主题显示到浏览器的顶部其实很简单，只要在标志对之间加入您要显示的文本即可。注意：标志对只能放在标志对之间。

         

        下面是一个综合的例子，仔细阅读，您便可以了解以上各个标志对在一个Html文档中的布局或所使用的位置。

        例1 Html文档中基本标志的使用

         

         

        红色背景、蓝色文本

         

         

        1.

        2.

        3.

        4.

        5.

        6.

        上一个教程中我们讲了Html文档的基本标志，但我们还不知道怎样在浏览器中显示文本之类的东西，这正是我们在教程二中将要谈到的。在学习之前，必须强调一下，我们这个教程中所讲的格式标志统统都是用于标志对之间的。

         

        1.

        标志对是用来创建一个段落，在此标志对之间加入的文本将按照段落的格式显示在浏览器上。另外，

        标志还可以使用align属性，它用来说明对齐方式，语法是：

        。align可以是Left(左对齐)、Center(居中)和Right(右对齐)三个值中的任何一个。如

        表示标志对中的文本使用居中的对齐方式。

         

        2.

        是一个很简单的标志，它没有结束标志，因为它用来创建一个回车换行，这么一说我想您该会使用了吧。在
        的使用上还有一定的技巧，如果您把
        加在

        标志对的外边，将创建一个大的回车换行，即
        前边和后边的文本的行与行之间的距离比较大，若放在

        的里边则
        前边和后边的文本的行与行之间的距离将比较小，您不妨试试看。

         

        3.

        在

        标志对之间加入的文本将会在浏览器中按两边缩进的方式显示出来。

         

        4.

        用来创建一个普通的列表，

        用来创建列表中的上层项目，

        用来创建列表中最下层项目，

        和

        都必须放在

        标志对之间。看一下下边的例子您就会明白了：

         

        例2 创建一个普通列表

        中国城市

        北京

        上海

        广州

        美国城市

        华盛顿

        芝加哥

        纽约

         

        此例在浏览器中的显示如下:

        中国城市

        北京

        上海

        广州

        美国城市

        华盛顿

        芝加哥

        纽约

         

        5.

        标志对用来创建一个标有数字的列表；

        标志对用来创建一个标有圆点的列表；

        标志对只能在

        或

        标志对之间使用，此标志对用来创建一个列表项，若

        放在

        之间则每个列表项加上一个数字，若在

        之间则每个列表项加上一个圆点。请看下边的例子：

         

        例3 标有数字或圆点的列表

         

        中国城市

        1. 北京
        2. 上海
        3. 广州

         

        美国城市

        • 华盛顿
        • 芝加哥
        • 纽约

         

        此例在浏览器中的显示如下:

         

        中国城市

         

        北京

        上海

        广州

        美国城市

         

        华盛顿

        芝加哥

        纽约

        6.

        标志对用来排版大块Html段落，也用于格式化表，此标志对的用法与

        标志对非常相似，同样有align对齐方式属性，读者可以自己试试看。

         

        html标签的用法=======================================================================================

         

        一、基本概念：

         网页、网站、浏览器、IE/NetScape

         HTML：超文本标记语言，什么是超文本、什么是标记语言。

         HTML的内容怎样显示出来。

        二、HTML语法：

         

         

         

         

        三、的一些属性：

         什么是属性：

         text:设定整个网页中文字的色彩

         link:用于设定一般超链接文本的显示色彩

         alink:用于设定鼠标移动到超链接上并按下鼠标是超文本的显示色彩

         vlink:设置访问过的超链接的色彩

         background:设定背景图片，可以是绝对路径也可以是相对路径。

         bgcolor:用户设定背景色，当已设定background时这个属性会失去作用

         leftmargin:左边距

         topmargin:上边距

        四、注释与特殊字符：

         

         注释的内容不会被显示出来

         注释不能被嵌套。

         < <

         > >

         & &

         " '

          注册符号

          版权符号

         " TM

           空格

        五、格式标签

         

        :用来创建一个段落,可以用align属生来设置段落的对齐方式

         
        :单标记直接在“>“前加一个“/ ”表示结束标记，显示一个换行

         

        :对之间的图形或文本在水平方向居中显示

         :移动图片或文本。direction属性：内容的移动方向（left,right,down,up）;behavior：指定内容的移动行为（scroll,alternate,slide）

         

        ：用来创建一个普通列表。

         

        :

        创建一个标有数字的列表;

        对创建的列表标有一个圆点;

        只能在

        或

        之间使用，表示列表项

         

        :对文本进行预格式处理

        六、文本标签：

         

        ......

        :把文本以标题方式显示。

         :分别对应粗体，斜体，下划线

         :分别对应下上标的显示

         :引用方式的字体，通常是斜体

         :显示需要强调的文本，通常是斜体加粗

         :用来显示加重文本，通常是加粗显示

         :对字体、字号、颜色进行改变。face属性：字体;Size属生：大小;  Color属生：色彩

        七、图像标签：　

         

          src属性：必不可少，用来设置图像文件所在位置。

          alt属性：当鼠标移到图像上显示的提示文本，当图像无法显示时，所显示的代替文字

          align属性：设置图像与周围文本的对齐方式。top,bottom,left,right

          border属性：设置图像的边框宽度

          width和height：设置图像的长宽高

          :在HTML文档中加入一条水平线。

          size:线的粗细

          color:线的色彩

          width:线的长度

          noshade:阴影显示

        八、超链接标签：

         通一资源定位符：URL;

          如：http://www.sina.com

          http：所使用的协议;www.sina.net：要访问的主机名;80：端口号

         :把中间标记的内容作为超链接显示，href的内容作为超连接点击后转向的页面。

          如： 新浪网

           

          href属性是不可少的；

          target属性：指明在浏览器的哪个窗口打开新页面。

         ：锚点标记，在同一网页中设置多个锚点便于超链接的浏览。

          如： 跳转到第一个标记上

         mailto:打开电子邮件:

          联系我们

        九、：图像地图将一个图像分成多个部分，各部分分别指向不同的链接。

         ：给图像分块

         shape属性可以是以下几种形状：

          rect:矩形，此时的coords为矩形的左上角个右下角的坐标

          poly:多边形，此时的coords为多边形的各个顶点

          circle:圆，此时coords为圆习坐标及半径

         如：

         

         

          

          

          

         

        十、表格标签：

        	3.0 不换行	N3.0 储存格背景颜色	3.0 储存格横向连接	3.0 储存格纵向连接	N1.1 储存格宽度	（以pixels为单位）   N1.1 储存格宽度比率	（页宽为100%）   3.0 表格标题		一样，不过会对中并加粗）   3.0 表格标题对齐	3.0 表格标题不换行	3.0 表格标题占几栏	3.0 表格标题占几列	N1.1 表格标题宽度	（以pixels为单位）   N1.1 表格标题比率宽度	（页宽为100%）   3.0 表格抬头

        ：定义一个表格的开始和结束

         ：定义一行的开始和结束

         ：定义一个单元格的开始和结束

         

        的属性：

          bgcolor:设置表格的背景色彩

          border:设置表格的边框的宽度

          bordercolor:设置表格边框色彩

          bordercolorlight:设置表格边框明亮部分的色彩

          bordercolordark:设置表格边框昏暗部分的色彩

          cellspacing:设置单元格之间的间隔

          cellpadding：设置单元格内部的内容与边框的间隔

          width:表格的宽度

          height:表格的高度

         

          align:整行单元格的内容水平对齐方式left,center,right。

          valign:整行单元格的内容竖直对齐方式top middle,bottom

          bgcolor:设置这一行的色彩

         

          width:单元格的宽度（大小）

          height:单元格的高度

          align:单元格内部内容的水平对齐方式

          valign:单元格内部内容的竖直对齐方式

          colspan:设置一个单元格跨占的列数

          rowspan:设置一个单元格跨占的行数

          nowrap:禁止单元格内的内容自动换行

         与类似只不过里面显示的内容是黑体居中的

        十一、框架标签：

         什么是框架：将一个窗口分割成多部分，每一部分显示一个独立的页面。

         框架只是分割窗口。

         定义一个框架集：

          rows:将窗口竖直拆分时窗口的大小比例

          cols:将窗口水平拆分窗口的大小比例

         定义一个具体的框架窗口：

          src:要显示网页的ＵＲＬ

          name:框架窗口的名子

          taget:该框架中的超链接默认的打开窗口_blank,_parent,_self,_top。

          scrolling:是否在框架边上出现滚动条yes,no,auto

          noresize:禁止用户拖动分隔线来调整框架的大小,直接将该属生放入就可以了。

         在一个网上插入一个简单的框架窗口，这个窗口用来显示另一个文件。

          name:框架窗口的名子

          src:框架窗口中所显示的新的网页

        十二、表单标签：

         什么时表单？

         :定义表单的开始和结束位置<略讲>

          action:处理表单内容的服务器程序的ＵＲＬ

          method:提交给服务器处理表单信息的方式

           get:将表单信息以ＵＲＬ参数的形式附在action的ＵＲＬ后面

           set:将表单信息以ＨＴＴＰ消息实体发送给ＷＥＢ服务器

          target:设置服务器返回结果显示的窗口

          title:当鼠标放在表单上的时候以黄色的泡泡进行提示

         

        ：定义一个提交按钮

          action:指定ＵＲＬ所指定的服务器程序

          value:按钮上的文字

         :定义一个重新填写的按钮。

          value:按钮上的文字

         :定义一个单行文本框

          size:输入区域的宽度，以字符个数为单位

          value:文本框的内容

          maxlength:用户能够输入的最大字符串长度

          readonly:属性存在时，文本框可以获得焦点，但用户不能更改里面的内容。

          disable:属性存在时，文本框不能获得焦点，也不能更改里面的内容。

         :定义一个复选框

          name:复选框的名，同一组复选框用同一个名子

          checked:该复选框是否被选中

          value:指定复选框被选中时，这个复选框的后台值

         :定义一个单选按钮

          name:单选按钮的名，同一组单选按钮用同一个名子

          value:指定单选按钮被选中时，这个单选按钮的后台值

         ：在表单上添加一个隐式的字段的元素，浏览器不会显示这个字段

          name:名子

          value:值

          当表单提交的时候会以name=value的形式提交到服务器上去。

         :在表单上定义一个普通的按钮，这个按钮通常与某个脚本代码下关联

         :在表单上定义一个密码输入区域.

         :用来从本机向服务器传文件

         :在表单上创建一个图像元素。

          图像的源文件由src属性来指定，它没有value属性。

          图像元素在某些情况下可以代替submit按钮来使用

          单击图像元时就会将表单信息和单击处的x,y值一起发送到服务器

         创建一个下拉列表框或可以复选的列表框。

          size:设置列表框中可见选项的数目。默认值是１，这时显示的是下拉列表框。

          mutiple属性：这是一个不且赋值的属性，定义列表框是否可以多选。

          在列表框中定义各项是用来实现的。

         为列表框中添加项目

          value:项目的后台值

          selected:指定项目是否被选定

         创建一个可输入多行文本的文本框

          cols:文本框的列数

          rows:文本框的列数

        十三、分区标签：

         

        :区域标签，层

         :区域标签

        十四、头元素:

         标签：用于指定网页中超链接的基准地址。网页中所有超链接的相对地址都以该地址为基准地址。

          该标签只能放在标签之间。

          如：

         标签：通常用于文件的之间。主要有两种类型的，它们用不同的属性名(name,http-equiv)来划分。

          name属性主要用于在网页中加入一些关于网页的描述信息，例如，网页的关键字，网页的描述信息等

          http-equiv属性主要用于在HTML文档中模拟HTTP头。

          什么是HTTP头？

           通过访问网页时，服务器除了返回网页文件本身的内容（也就是在浏览器中用查看源文件能看到的东西）之外，它还在返回网页文件内容之前，传送一部分被称为HTTP头的内容给浏览器，这部分肉容是在浏览器的查看源文件中看不到的。HTTP头的内容相当于服务器发送给浏览器的一些暗号指令，通知浏览器查看该网页时应使用的字符编码、是否本地缓存、网页的到期时间、是否间隔一定时间以后刷新页面或跳到其它页面等。

         

          name属性的设置：

           Keywords:网页的关键字，以便于在搜索引擎中进行收集信息。

            

           Description：网页描述信，以便于搜索。

           Generator：用于编辑此页所用的工具名，content中填入所用的网页编辑软件。

           Author：用于说明网页的作者，content中填入作者的姓名。

           Copyright:用于版权声明，content中填入你的版权声明。

          http-equiv属性设置：

           Content-Type:用于说明网页内容的类型以及文本内容所使用的字符集编码。

            

           Refresh:告诉浏览器定时自动刷新网页

            

            通知浏览器过一秒后跳转到新浪网上去。

           Expires:用于设定网页的到期时间。为了提高效率，浏览器可以被设置成缓存以前访问的页面，当再次访问该页面时，浏览器不会再去服务器上访问，而是直接在本地缓存中读到。如果将其Content设为0则禁止浏览器使用缓存页面。

            

           Windows-Target:强制页面在某个窗口显示。例如要防止别人把你的网页作为frame页面调用：