详解HTML标签和属性Word文档格式.docx
《详解HTML标签和属性Word文档格式.docx》由会员分享，可在线阅读，更多相关《详解HTML标签和属性Word文档格式.docx（17页珍藏版）》请在冰豆网上搜索。
）的顺序进行排列。
在head标签中填写与该文件相关的信息，body标签中填写世纪要在浏览器上显示的内容。
另外，在head标签中，只能有一个代表文件标题的title标签
设置页面的文字颜色
bodytext=”颜色指定”>
设置页面的背景颜色
bodybgcolor=”颜色指定”>
设置页面的背景图像
bodybackground=”图像的URL”>
按照目的设定范围
div>
/div>
span>
/span>
插入注释
—注释语句-->
3、设置文件信息
添加标题
title标签用来给HTML文件添加标题
这个标签一定要位于<
圈定的范围内。
在这里指定的标题除了可以在通常的浏览器窗口的标题栏中显示以外，还可以作为加入收藏夹时的标题
显示文件编码
metahttp-equiv="
Content-Type"
content="
text/html;
charset=文字编码"
/>
meta标签的charset属性表示该HTML文件是用什么文字编码编写的
注意，该标签一定要位于<
范围内
添加关键字、内容介绍及作者姓名
metaname="
keywords"
关键字1，关键字2，…"
description"
内容介绍"
author"
作者姓名"
这些信息都不会在画面上显示出来，但是搜索引擎在收集信息时要用到
设置样式表和脚本语言的种类
Content-Style-Type"
样式表的种类"
Content-Script-Type"
脚本的种类"
在HTML文件内可以设置样式表和脚本的默认语言
设置进入网页
linkrel=”关系”href=”URL”>
linkrev=”关系”href=”URL”>
rel：
在本页看到的，与URL标明的网页之间的关系
rev：
在URL标明的网页中看到的，与本页之间的关系
link标签表示的是该文件和与其相关的其他文件之间的关系
设置标准URL
basehref=”绝对URL”>
basehref=”绝对URL”target=”目标名”>
base标签用来设置将该页中使用的相对URL的标准指向成绝对URL，指定了这个标签之后，在该页指定的相对URL就会全部认定为已在这里指定的绝对URL。
如果不进行这项设置，就以当前页的位置为标准，如果指定了Target属性，就可以指定打开链接地址网页的默认框架和窗口
设置自动倒入网页功能
refresh"
秒数"
；
URL=要移动到的URL/>
在经过数秒后，自动开始导入网页。
如果指定了要移动到的URL，就会导入URL指定的网页。
如果没有指定，就会再次导入相同的页
4、设置文本类型
设置各级标题
h1>
…
设置段落
p>
/p>
p标签表示的是该部分为一个段落
设置联系地址
address>
/address>
address标签表示的内容是该网页制作者的联系地址和有关网页内容的咨询地址等信息
设置强调内容
em>
/em>
strong>
/strong>
这两个标签所圈内容表示该部分是强调的内容
设置较短的引用文字
q>
/q>
qcite=”引用页的URL”>
q标签代表的意思是该部分为较短的引用文，在引用段落的某一部分的时候使用，如果使用cite属性，还能够把引用页的URL显示出来
设置较长的引用文章
blockquote>
/blockquote>
blockquotecite=”引用页的URL”>
设置文字内容的出处
cite>
/cite>
设置缩略语
abbrtitle=”字符串”>
/abbr>
acronymtitle=”字符串”>
/acronym>
title：
不处于省略状态下的词汇（字符串）
设置添加的内容
inscite=”URL”datetime=”添加日期时间”>
/ins>
设置需要删除的内容
decite=”URL”datetime=”删除日期时间”>
/del>
突出显示段落中的术语
dfn>
/dfn>
表示与程序关联的文本
kbd>
/kbd>
：
输入文本
samp>
/samp>
输出样本
code>
/code>
源代码
var>
/var>
变量
显示特殊符号
&
lt：
gt：
>
quot：
”
amp：
5、设置显示方式
设置文字的换行
br>
添加了br标签之后，文本就会再该处换行。
即使在HTML代码中已经换行了，在浏览器上显示的时候却反映不出来，因此如果想在浏览器上换行的话，就要使用br标签
添加不同横线效果
hr>
hrsize=”粗细”width=”长度”align=”对齐方式”noshade>
加入了hr标签后，就可以在其标注的地方显示横线
设置文本格式
b>
/b>
黑体字
i>
/i>
斜体字
tt>
/tt>
等大字体
sup>
/sup>
上标
sub>
/sub>
下标
u>
/u>
下划线
s>
/s>
删除线
设置空格和换行
pre>
/pre>
标签可以保留文字在源代码中的格式，使得页面中显示的内容和源代中的格式完全一致
设置居中效果
center>
/center>
center标签用于将指定范围内的内容设置为居中
设置行对齐方式
h1align=”行对齐方式”>
palign=”行对齐方式”>
divalign=”行对齐方式”>
使用align属性可以设置标题、段落以及指定范围内的行对齐方式
设置文字颜色
fontcolor=”设置颜色”>
/font>
设置字体类型
font>
字体名”>
设置字体字号
fontsize=”字号”>
相对改变字体大小
big>
/big>
增大
small>
/small>
减小
fontsize=”+n”>
增大n号
fontsize=”-n”>
减小n号
设置字号的基本大小
basefontsize=”字号”>
size：
1~7
6、设置链接相关的属性
链接到其他页面
ahref=”链接目标URL”>
/a>
a标签的href属性能把指定的范围链接到其他页面上，链接部分的词语要设置得让人看到这个部分就能联想到链接网页上的具体内容
另外，在链接图像的时候，一定要插入替代的文字（alt=”~”）使用户能够很明确的了解到链接的目标
链接到当前页的特定位置
ahref=”#位置名”>
指定链接文件（从什么位置开始链接）
aname=”位置名”>
指定链接的地址（要链接的位置）
如果一页上的内容非常多，可以在一个网页中给特定的位置命名，然后再链接到该位置（跳转）。
在给链接对象位置命名的时候要使用name属性。
然后，在链接的时候，要用href属性在链接地址名称的前面加上#号
设置链接到其他页面的特定位置
ahref=”URL#位置名”>
指定链接源（从什么位置开始链接）
在链接到其他网页上的时候，可以先给那一页上特定的位置命名，然后链接到该位置。
然后，在链接的时候，要用href属性设置成”URL+#+位置名”这样一种格式
设置链接文字的颜色
bodylink=”指定颜色”vlink=”指定颜色”alink=”指定颜色”>
link：
还没有看见的链接部分的文字颜色
vlink：
已经看见的链接部分的文字颜色
alink：
鼠标单击链接部分的文字颜色
body标签用于设置网页整体链接部分的文字颜色
在新窗口中打开链接网页
ahref=”URL”target=”窗口名”>
利用target属性可以设置打开链接窗口的方式
通过设置链接来启动邮箱
ahref=”mailto：
邮箱地址”>
7、制作不同类型的列表
为列表添加不同类型的标记
ul>
li>
列表项目1<
/li>
列表项目2<
…<
ul标签的作用是将列表（条款形式）加上圆点或方括号的标记。
列表的整体要在<
/ul>
标签范围内，在这之间的各个项目要在<
标签之内
更改列表标记
ultype=”标记种类”>
litype=”标记种类”>
标记的种类包括disc、cicle和square
制作带序号的列表
ol>
改变序号的样式
oltype=”序号样式”>
/ol>
litype=”序号样式”>
改变序号的顺序
olstart=”开始序号”>
livalue=”开始序号”>
制作包含专用语和解释的列表
dl>
dt>
专用语<
dd>
对其解释<
/dd>
8、设置表格
表格的基本形式
tableborder=”边框的粗度”>
/table>
整个表格
tr>
/tr>
单独一行
th>
/th>
单元格：
标题用
td>
/td>
数据用
表格的整体要圈在<
table>
之间显示，表格当中某一个单元格用<
表示或者<
表示。
每个单元格都在表的单独以行，放置在<
中。
也就是说，table标签的内容是由tr标签构成的。
各个tr标签的内容是由表示单元格的th或者td标签构成的。
th标签代表这个单元格的内容是标题。
td标签代表这个单元格的内容是数据
为表格添加标题
caption>
/caption>
captionalign=”对齐方式”>
caption标签用来给表格添加标题
该标签一定要放在table标签的紧后面。
标题的显示位置（即对齐方式）可以指定在表格的上部，或者表格的下部
指定表格的大小
tablewidth=”宽度”>
宽度：
针对像素或者窗口的百分比
指定单元格大小
thwidth=”宽度”height=”高度”>
tdwidth=”宽度”height=”高度”>
合并单元格
throwspan=”垂直方向的合并数”>
thcolspan=”水平方向的合并数”>
tdrowspan=”垂直方向的合并数”>
tdcolspan=”水平方向的合并数”>
垂直方向的合并数：
从当前单元格开始向下合并的单元格数
水平方向的合并数：
从当前单元格开始向右合并的单元格数
设置单元格之间的距离
tablecellspacing=”单元格的距离”>
设置单元格边框与内容之间的距离
tablecellpadding=”单元格边框与内容之间的距离”>
设置单元格中的行对齐方式和列对齐方式
align属性用于设置单元格内的行对齐方式，valign属性用来设置单元格内的列对齐方式
禁止在单元格内换行
thnowrap>
tdnowrap>
设置表格和单元格的背景颜色
bgcolor属性用于指定表格和单元格中的背景颜色
设置表格和单元格的背景图像
background属性用于指定表格和单元格中的背景图像
设置表格外框的宽度
tableborder=”外框的宽度”>
设置表格外框的显示形式
tableframe=”外框的显示形式”>
设置表格内补边框线的显示形式
tablerules=”内部边框线的显示形式”>
定义表格中的横行
thead>
/thead>
表头部分
tbody>
/tbody>
表体部分
tfoot>
/tfoot>
表底部分
thead标签、tbody标签和tfoot标签都是用来定义表格的横行（tr标签）的
这样组合之后，就可以针对该组合的整体来应用属性和样式表。
使用这些标签的时候，一定要以thead标签、tfoot标签和tbody标签的顺序进行排列。
在一个表格里，只能放置一个thead标签和一个tfoot标签，而tbody标签可以根据需要放置多个
利用纵列设置表格属性和样式表
colspan=”纵列数”>
colspan=”纵列数”width=”宽度”>
col标签不仅可以用来改变表格的纵列结构，还可以用来根据纵列，来综合指定宽和行对齐方式等属性以及样式表
该标签放置的位置要在caption标签的紧后面（如果没有caption标签，就放在table标签的开始标签的紧后面），以及thead标签和tr标签的前面
设置表格居中
tablealign=”center”>
将表格嵌入到文本中
tablealign=”对齐方式”>
位置：
left,right
将table标签的align属性指定为left或者right后，就可以将表格以居左或居右的方式嵌入到文字中间
如果想要解除嵌入状态，可以使用<
标签的clear属性
解除表格的嵌套
brclear=”解除表格那一侧的嵌套”>
left：
解除左侧表格的嵌套
right：
解除右侧表格的嵌套
all：
解除两侧表格的嵌套
设置表格与嵌套文字之间的距离
tablevspace=”垂直距离”hspace=”水平距离”>
垂直距离：
表格的上下框与文字间的距离
水平距离：
表格的左右框与文字间的距离
9、设置图像与多媒体
插入图像
imgsrc=”URL”width=”宽度”hignt=”高度”alt=”替代文字”>
使用img标签，可以把图像插入到HTML文件中
图像的格式一般可以使用GIF格式、JPEG格式和PNG格式
不管图像实际的大小如何，都会按照在这里所指定的宽度和高度来显示
alt属性是在不能显示图像的情况下，指定替代图像所使用的文字
设置图像的边框
imgsrc=”URL”alt=”替代文字”border=”边框的粗度”>
设置图像与文字的垂直位置关系
imgsrc=”URL”alt=”替代文字”align=”对齐方式”>
在同一行中，如果有图像和文字，那么就可以用align属性来设置图像和文字的垂直位置关系
制作图像热区
imgsrc=”URL”alt=”替代文字”usemap=”#map名”>
mapname=”map名”>
/map>
areashape=”形状”cords=”坐标”href=”URL”alt=”替代文字”>
在map标签中，用来设置实际单击的区域和链接地址的是area标签
在area标签中，一定要指定表示链接地址的替代文字，之后要用image标签的usemap属性指定定义后的imagemap的名称（名称前面要加#），这样图像就可以作为imagemap产生相应的效果
将图像嵌套在文本中
解除图像的嵌套
brclear=”解除哪一侧图像的嵌套”>
设置图像与周围文字之间的距离
imgsrc=”URL”alt=”替代文字”vspace=”垂直距离”hspace=”水平距离”>
放置Java小程序
appletcode=”类文件名”width=”宽度”height=”高度”>
/applet>
paramname=”参数名”value=”参数值”>
applet标签是嵌入Java小程序时要使用的标签
如果使用param标签，在执行java小程序时，需事先指定一些必要值。
这时，param标签要位于<
applet>
范围的最开始部分
10、制作不同类型的表单
制作填写表单
formaction=”URL”method=”发送形式”enctype=”MIME类型”target=”窗口名称”>
/form>
URL：
用来处理发送后表格的程序的URL
发送形式：
get,post
MIME类型：
以post方式发送内容时的MIME类型
窗口名称：
先是发送结果的窗口或框架名
form标签表示在表单中填写的内容是可以发送的
制作发送按钮
inputtype=”submit”value=”标签”name=”名称”>
标签：
在按钮上显示的文字
名称：
按钮的名称
将input标签的type属性设置为submit，再根据form标签的设置，可以制作发送填写在表单中数据的按钮
制作重置按钮
inputtype=”reset”value=”标签”>
制作通用按钮
inputtype=”button”name=”名称”value=”标签”>
通用按钮通常与JavaScript等脚本语言组合使用
利用图像来制作发送按钮
inputtype=”image”src=”URL”name=”名称”alt=”替代文字”align=”对齐方式”>
通常，发送按钮都使用inputtype=”submit”代码，不过图像也可以作为发送按钮，具有发送功能。
这时，图像被单击的位置将和表单的内容一起被发送
制作不同功能的发送按钮
buttontype=”类型”name=”名称”value=”发送值”>
/button>
类型：
submit,reset,button
button标签是用来制作按钮专用的
通过指定type属性值，就可以产生具有不同功能的按钮，包括发送按钮、重置按钮和通用按钮。
另外，在<
button>
中放置相应的内容，可以作为按钮的标签显示出来。
在需要进行其他处理并设置多个发送按钮的情况下，根据name属性和value属性所显示的值，接受方就可以分辨出单击的是哪一个发送按钮
制作单行文本框
inputtype=”text”name=”名称”value=”默认文字”size=”宽度”maxlength=”字符的最大输入数量”>
制作多行文本框
textareaname=”名称”rows=”行数”cols=”宽度”>
/textarea>
制作输入密码的文本框
inputtype=”password”name=”名称”value=”默认文字”size=”宽度”maxlength=”字符的最大输入数量”>
插入隐藏域
inputtype=”hidden”name=”名称”value=”发送值”>
制作单选按钮
inputtype=”radio”name=”名称”value=”发送文字”>
inputtype=”radio”name=”名称”value=”发送文字”checked>
将input标签的type属性设置为radio，可以用来制作单选按钮。
单选按钮是多个选项当中只能选择其一的按钮。
作为公共项目的选项而使用的单选按钮，要把它们都指定为同一名称。
另外，发送数据的时候，为了识别所选的是哪一项，要用value属性来指定相应的值
制作复选框
inputtype=”checkbox”name=”名称”value=”发送文字”>
inputtype=”checkbox”name=”名称”value=”发送文字”checked>
将input标签的type属性设置为checkbox，可以用来制作复选框。
复选框可以在多个选项当中进行多项选择。
作为公共项目的选项而使用的复选框，要把它们都指定为同一名称。
制作菜单
selectname=”
升级会员 