整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

HTML常用代码集合,背完这些基本可以自己做表白网页了

lt;marquee>...</marquee>普通卷动

<marquee behavior=slide>...</marquee>滑动

<marquee behavior=scroll>...</marquee>预设卷动

<marquee behavior=alternate>...</marquee>来回卷动

<marquee direction=down>...</marquee>向下卷动

<marquee direction=up>...</marquee>向上卷动

<marquee direction=right></marquee>向右卷动

<marquee direction=left></marquee>向左卷动

<marquee loop=2>...</marquee>卷动次数

<marquee width=180>...</marquee>设定宽度

<marquee height=30>...</marquee>设定高度

<marquee bgcolor=FF0000>...</marquee>设定背景颜色

<marquee scrollamount=30>...</marquee>设定卷动距离

<marquee scrolldelay=300>...</marquee>设定卷动时间

<!>字体效果

<h1>...</h1>标题字(最大)

<h6>...</h6>标题字(最小)

<b>...</b>粗体字

<strong>...</strong>粗体字(强调)

<i>...</i>斜体字

<em>...</em>斜体字(强调)

<dfn>...</dfn>斜体字(表示定义)

<u>...</u>底线

<ins>...</ins>底线(表示插入文字)

<strike>...</strike>横线

<s>...</s>删除线

<del>...</del>删除线(表示删除)

<kbd>...</kbd>键盘文字

<tt>...</tt> 打字体

<xmp>...</xmp>固定宽度字体(在文件中空白、换行、定位功能有效)

<plaintext>...</plaintext>固定宽度字体(不执行标记符号)

<listing>...</listing> 固定宽度小字体

<font color=00ff00>...</font>字体颜色

<font size=1>...</font>最小字体

<font style =font-size:100 px>...</font>无限增大

<!>区断标记

<hr>水平线

<hr size=9>水平线(设定大小)

<hr width=80%>水平线(设定宽度)

<hr color=ff0000>水平线(设定颜色)

<br>(换行)

<nobr>...</nobr>水域(不换行)

<p>...</p>水域(段落)

<center>...</center>置中

<!>连结格式

<base href=位址>(预设好连结路径)

<a href=位址></a>外部连结

<a href=位址 target=_blank></a>外部连结(另开新视窗)

<a href=位址 target=_top></a>外部连结(全视窗连结)

<a href=位址 target=页框名></a>外部连结(在指定页框连结)

<!>贴图/音乐

<img src=图片位址>贴图

<img src=图片位址 width=180>设定图片宽度

<img src=图片位址 height=30>设定图片高度

<img src=图片位址 alt=提示文字>设定图片提示文字

<img src=图片位址 border=1>设定图片边框

<bgsound src=MID音乐档位址>背景音乐设定

<!>表格语法

<table aling=left>...</table>表格位置,置左

<table aling=center>...</table>表格位置,置中

<table background=图片路径>...</table>背景图片的URL=就是路径网址

<table border=边框大小>...</table>设定表格边框大小(使用数字)

<table bgcolor=颜色码>...</table>设定表格的背景颜色

<table borderclor=颜色码>...</table>设定表格边框的颜色

<table borderclor=颜色码>...</table>设定表格边框的颜色

<table borderclordark=颜色码>...</table>设定表格暗边框的颜色

<table borderclorlight=颜色码>...</table>设定表格亮边框的颜色

<table cellpadding=参数>...</table>指定内容与格线之间的间距(使用数字)

<table cellspacing=参数>...</table>指定格线与格线之间的距离(使用数字)

<table cols=参数>...</table>指定表格的栏数

<table frame=参数>...</table>设定表格外框线的显示方式

<table width=宽度>...</table>指定表格的宽度大小(使用数字)

<table height=高度>...</table>指定表格的高度大小(使用数字)

<td colspan=参数>...</td>指定储存格合并栏的栏数(使用数字)

<td rowspan=参数>...</td>指定储存格合并列的列数(使用数字)

<!>分割视窗

<frameset cols="20%,*">左右分割,将左边框架分割大小为20%右边框架的大小浏览器会自动调整

<frameset rows="20%,*">上下分割,将上面框架分割大小为20%下面框架的大小浏览器会自动调整

<frameset cols="20%,*">分割左右两个框架

<frameset cols="20%,*,20%">分割左中右三个框架

<分割上下两个框架

<frameset rows="20%,*,20%">分割上中下三个框架


<! - - ... - -> 注解

<a href target> 指定超连结的分割视窗

<a href=#锚的名称> 指定锚名称的超连结

<a href> 指定超连结

<a name=锚的名称> 被连结点的名称

<address>....</address> 用来显示电子邮箱地址

<b> 粗体字

<base target> 指定超连结的分割视窗

<basefont size> 更改预设字形大小

<bgsound src> 加入背景音乐

<big> 显示大字体

<blink> 闪烁的文字

<body text link vlink> 设定文字颜色

<body> 显示本文

<br> 换行

<caption align> 设定表格标题位置

<caption>...</caption> 为表格加上标题

<center> 向中对齐

<cite>...<cite> 用於引经据典的文字

<code>...</code> 用於列出一段程式码

<comment>...</comment> 加上注解

<dd> 设定定义列表的项目解说

<dfn>...</dfn> 显示"定义"文字

<dir>...</dir> 列表文字标签

<dl>...</dl> 设定定义列表的标签

<dt> 设定定义列表的项目

<em> 强调之用

<font face> 任意指定所用的字形

<font face> 任意指定所用的字形

<font size> 设定字体大小

<form action> 设定户动式表单的处理方式

<form method> 设定户动式表单之资料传送方式

<frame marginheight> 设定视窗的上下边界

<frame marginwidth> 设定视窗的左右边界

<frame name> 为分割视窗命名

<frame noresize> 锁住分割视窗的大小

<frame scrolling> 设定分割视窗的卷轴

<frame src> 将html档加入视窗

<frameset cols> 将视窗分割成左右的子视窗

<frameset rows> 将视窗分割成上下的子视窗

<frameset>...</frameset> 划分分割视窗

<h1>~<h6> 设定文字大小

<head> 标示文件资讯

<hr> 加上分格线

<html> 文件的开始与结束

<i> 斜体字

<img align> 调整图形影像的位置

<img alt> 为你的图形影像加注

<img dynsrc loop> 加入影片

<img height width> 插入图片并预设图形大小

<img hspace> 插入图片并预设图形的左右边界

<img lowsrc> 预载图片功能

<img src border> 设定图片边界

<img src> 插入图片

<img vspace> 插入图片并预设图形的上下边界

<input type name value> 在表单中加入输入栏位

<isindex> 定义查询用表单

<kbd>...</kbd> 表示使用者输入文字

<li type>...</li> 列表的项目 ( 可指定符号 )

<marquee> 跑马灯效果

<menu>...</menu> 条列文字标签

<meta name="refresh" content url> 自动更新文件内容

<multiple> 可同时选择多项的列表栏

<noframe> 定义不出现分割视窗的文字

<ol>...</ol> 有序号的列表

<option> 定义表单中列表栏的项目

<p align> 设定对齐方向

<p> 分段

<person>...</person> 显示人名

<pre> 使用原有排列

<samp>...</samp> 用於引用字

<select>...</select> 在表单中定义列表栏

<small> 显示小字体

<strike> 文字加横线

<strong> 用於加强语气

<sub> 下标字

<sup> 上标字

<table border=n> 调整表格的宽线高度

<table cellpadding> 调整资料栏位之边界

<table cellspacing> 调整表格线的宽度

<table height> 调整表格的高度

<table width> 调整表格的宽度

<table>...</table> 产生表格的标签

<td align> 调整表格栏位之左右对齐

<td bgcolor> 设定表格栏位之背景颜色

<td colspan rowspan> 表格栏位的合并

<td nowrap> 设定表格栏位不换行

<td valign> 调整表格栏位之上下对齐

<td width> 调整表格栏位宽度

<td>...</td> 定义表格的资料栏位

<textarea name rows cols> 表单中加入多少列的文字输入栏

<textarea wrap> 决定文字输入栏是自动否换行

<th>...</th> 定义表格的标头栏位

<title> 文件标题

<tr>...</tr> 定义表格美一行

<tt> 打字机字体

<u> 文字加底线

<ul type>...</ul> 无序号的列表 ( 可指定符号 )

<var>...</var> 用於显示变数

<metahttp-equiv="Windows-Target"content="_top">


<NOBR> 取消换行 和<br>相反

总类(所有HTML文件都有的

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

文件类型 <HTML></HTML> 放在档案的开头与结尾)

文件主题 <TITLE></TITLE> 必须放在「文头」区块内)

文头 <HEA D></HEA D> 描述性资料,像是「主题」)

文体 <BODY></BODY> 文件本体)

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

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

标题<H?></H?>表示从16有六层选择)数值越高字越小

标题对齐 <H?ALIGN=LEFT|CENTER|RIGHT></H?>左对齐、居中对齐、右对齐

区分<P></P>

区分对齐<PALIGN=LEFT|RIGHT|CENTER|JUSTIFY></P>左对齐、右对齐、居中对齐、两端对齐

引文区块<BLOCKQUOTE></BLOCKQUOTE>通常会内缩)

斜体 <EM></EM>

加粗 <SPONG></SPONG>

引文 <CITE></CITE>通常会以斜体显示)

码<CODE></CODE>显示原始码之用)

样本<SA MP></SA MP>

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

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

键盘输入<KBD></KBD>

变数<VA R></VA R>

定义<DFN></DFN>有些浏览器不提供)

地址<A DDRESS></A DDRESS>

3.0大字<BIG></BIG>

3.0小字<SMA LL></SMA LL>

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

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

加粗<B></B>

斜体<I></I>

3.0底线<U></U>尚有些浏览器不提供)

3.0删除线 <S></S>尚有些浏览器不提供)

3.0下标 <SUB></SUB>

3.0上标 <SUP></SUP>

打字机体<TT></TT>用单空格字型显示)

预定格式<PRE></PRE>保留文件中空格的大小)

预定格式的宽度<PREWIDTH=?></PRE>以字元计算)

N1.0+向中看齐<CENTER></CENTER>文字与图片都可以)

N1.0闪耀<BLINK></BLINK>有史以来最被嘲弄的标签)

N1.0字体大小<FONTSIZE=?></FONT>从17

N1.0改变字体大小<FONTSIZE=+|-?></FONT>

N1.0基本字体大小<BA SEFONTSIZE=?>从17;内定为3

N2.0字体颜色<FONTCOLOR="#$$$$$$"></FONT>

连结与图形

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

链接 <A HREF="URL"></A >

连结到锚点<A HREF="URL#***"></A >如果锚点在另一个档案)

<A HREF="#***"></A >如果锚点目前的档案)

N2.0连结到目的视框<A HREF="URL"TA RGET="***"></A >

设定锚点<A NA ME="***"></A >

图形 <IMGSRC="URL">

图形看齐方式<IMGSRC="URL"ALIGN=TOP|BOTTOM|MIDDLE>

N1.0图形看齐方式<IMGSRC="URL"ALIGN=LEFT|RIGHT|TEXTTOP|A BSMIDDLE|BA SELINE|A BSBOTTOM>

取代文字 <IMGSRC="URL"ALT="***">如果没有办法显示图形则显示此文字)

点选图<IMGSRC="URL"ISMA P>需要CGI程式)

N2.0点选图 <IMGSRC="URL"USEMA P="URL">

N2.0地图 <MA PNA ME="***"></MA P>描述地图)

N2.0段落 <A REA SHA PE="RECT"COORDS=",,,"HREF="URL"|NOHREF>

3.0大小 <IMGSRC="URL"WIDTH="?"HEIGHT="?">以pixel为单位:px

N1.0图形边缘 <IMGSRC="URL"BORDER=?>以pixel为单位)

N1.0图形边缘空间 <IMGSRC="URL"HSPA CE=?VSPA CE=?>以pixel为单位)

N1.0低解析度图形 <IMGSRC="URL"LOWSRC="URL">

N1.1用户端拉 <META HTTP-EQUIV="Refresh"CONTENT="?;URL=URL">使用端自动更新

N2.0内嵌物件 <EMBEDSRC="URL">将物件插入页面)

N2.0内嵌物件大小 <EMBEDSRC="URL"WIDTH="?"HEIGHT="?">

分隔

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

段落 <P>通常是两个return

3.0段落 <P></P>新定义成容器型标签)

3.0文字看齐方式 <PALIGN=LEFT|CENTER|RIGHT></P>

换行 <BR>一个return

N1.0文字部份看齐方式<BRCLEA R=LEFT|RIGHT|A LL>与图形合用时)

横线 <HR>

N1.0横线对齐 <HRALIGN=LEFT|RIGHT|CENTER>

N1.0横线厚度 <HRSIZE=?>以pixel为单位)

N1.0横线宽度 <HRWIDTH=?>以pixel为单位)

N1.0横线比率宽度 <HRWIDTH=%>以页宽为100%

N1.0实线 <HRNOSHA DE>没有立体效果)

N1.0不可换行 <NOBR></NOBR>不换行)

N1.0可换行处 <WBR>如果需要,可在此断行)

列举(可以巢状列举)

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

无次序式列举<UL><LI></UL><LI>放在每一项前)

N1.0公布式列举 <ULTYPE=DISC|CIRCLE|SQUA RE>定义全部的列举项)

<LITYPE=DISC|CIRCLE|SQUA RE>定义这个及其後的列举项)

有次序式列举<OL><LI></OL><LI>放在每一项前)

N1.0数标型态 <OLTYPE=A |a|I|i|1>定义全部的列举项)

<LITYPE=A |a|I|i|1>定义这个及其後的列举项)

N1.0起始数字 <OLVA LUE=?>定义全部的列举项)

<LIVA LUE=?>定义这个及其後的列举项)

定义式列举 <DL><DT><DD></DL><DT>项目,<DD>定义)

表单式列举 <MENU><LI></MENU><LI>放在每一项前)

目录式列举 <DIR><LI></DIR><LI>放在每一项前)

背景与颜色

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

3.0重复排列的背景 <BODYBA CKGROUND="URL">

N1.1+背景颜色 <BODYBGCOLOR="#$$$$$$">依序为红、绿、蓝)

N1.1+文字颜色 <BODYTEXT="#$$$$$$">

N1.1+连结颜色 <BODYLINK="#$$$$$$">

N1.1+看过的连结 <BODYVLINK="#$$$$$$">

N1.1使用中的连结 <BODYALINK="#$$$$$$">

特殊字元(以下标签需用小写)

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

特别符号 &#?;其中 ?代表 ISO8859-1编码)

<&lt;>&gt;&&amp;"&quot;

注册商标TM?

N1.0+注册商标TM&reg;

著作权符号 ?

N1.0+著作权符号 &copy;

表单(通常需要与CGI程式配合)

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

定义表单 <FORMACTION="URL"METHOD=GET|POST></FORM>

N2.0上传档案 <FORMENCTYPE="multipart/form-data></FORM>

输入栏位 <INPUTTYPE="TEXT|PA SSWORD|CHECKBOX|RA DIO|IMA GE|HIDDEN|SUBMIT|RESET">

栏位名称 <INPUTNA ME="***">

栏位内定值 <INPUTVA LUE="***">

已选定 <INPUTCHECKED>适用於checkbox与 radiobox

栏位宽度 <INPUTSIZE=?>以字元数为单位)

最长字数 <INPUTMA XLENGTH=?>以字元数为单位)

下拉式选单 <SELECT></SELECT>

下拉式选单名称 <SELECTNA ME="***"></SELECT>

选单项目数量 <SELECTSIZE=?></SELECT>

多选式选单 <SELECTMULTIPLE>多选)

选项 <OPTION>

内定选项 <OPTIONSELECTED>

文字输入区 <TEXTA REA ROWS=?COLS=?></TEXTA REA >

输入区名称 <TEXTA REA NA ME="***"></TEXTA REA >

N2.0输入区换行方式 <TEXTA REA WRA P=OFF|VIRTUA L|PHYSICA L></TEXTA REA >

表格

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

3.0定义表格 <TA BLE></TA BLE>

3.0表格框线 <TA BLEBORDER></TA BLE>有或没有)

N1.1表格框线 <TA BLEBORDER=?></TA BLE>可以设定数值)

N1.1储存格左右留白 <TA BLECELLSPA CING=?>

N1.1储存格上下留白 <TA BLECELLPA DDING=?>

N1.1表格宽度 <TA BLEWIDTH=?>以pixel为单位)

N1.1宽度比率 <TA BLEWIDTH=%>页宽为100%

3.0表格列<P></P>

3.0表格列内容看齐 <PALIGN=LEFT|RIGHT|CENTERVA LIGN=TOP|MIDDLE|BOTTOM>

3.0储存格<TD></TD>须与列并用)

3.0储存格内容看齐 <TDALIGN=LEFT|RIGHT|CENTERVA LIGN=TOP|MIDDLE|BOTTOM>

3.0不换行 <TDNOWRA P>

N3.0储存格背景颜色 <TDBGCOLOR=#$$$$$$>

3.0储存格横向连接 <TDCOLSPA N=?>

3.0储存格纵向连接 <TDROWSPA N=?>

N1.1储存格宽度 <TDWIDTH=?>以pixel为单位)

N1.1储存格宽度比率 <TDWIDTH=%>页宽为100%

3.0表格标题 <TH></TH>跟<TD>一样,不过会对中并加粗)

3.0表格标题对齐 <THALIGN=LEFT|RIGHT|CENTERVA LIGN=TOP|MIDDLE|BOTTOM>

3.0表格标题不换行 <THNOWRA P>

3.0表格标题占几栏 <THCOLSPA N=?>

3.0表格标题占几列 <THROWSPA N=?>

N1.1表格标题宽度 <THWIDTH=?>以pixel为单位)

N1.1表格标题比率宽度<THWIDTH=%>页宽为100%

3.0表格抬头 <CA PTION></CA PTION>

3.0表格抬头看齐 <CA PTIONALIGN=TOP|BOTTOM>表格之上/之下)

视框(定义与控制萤幕上的特定区域)

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

N2.0视框格式总定义 <FRA MESET></FRA MESET>取代<BODY>

N2.0视框行长度分配 <FRA MESETROWS=,,,></FRA MESET>pixel或 %

N2.0视框行长度分配 <FRA MESETROWS=*></FRA MESET>*=相对大小)

N2.0视框栏宽度分配 <FRA MESETCOLS=,,,></FRA MESET>pixel或 %

N2.0视框栏宽度分配 <FRA MESETCOLS=*></FRA MESET>*=相对大小)

N2.0定义个别视框 <FRA ME>定义个别视框)

N2.0个别视框内容 <FRA MESRC="URL">

N2.0个别视框名称 <FRA MENA ME="***"|_blank|_self|_parent|_top>

N2.0边缘宽度 <FRA MEMA RGINWIDTH=?>「左」与「右」边界)

N2.0边缘高度 <FRA MEMA RGINHEIGHT=?>「天顶」与「地底」边界)

N2.0卷动条 <FRA MESCROLLING="YES|NO|A UTO">

N2.0不可改变大小 <FRA MENORESIZE>

N2.0无视框时的内容 <NOFRA MES></NOFRA MES>如果浏览器不提供视框功能的话)

杂项

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

说明 <!--***-->浏览器不会显示)

档案型态声明 <!DOCTYPEHTMLPUBLIC"-//IETF//DTDHTML2.0//EN">

3.0档案型态声明 <!DOCTYPEHTMLPUBLIC"-//W3O//DTDW3HTML3.0//EN">

可搜寻 <ISINDEX>指示可搜寻的索引项)

N1.0提示 <ISINDEXPROMPT="***">要求输入的提示文字)

送出搜寻条件 <A HREF="URL?***"></a>其中的问号不是数字,而是「问号」)

基本档案的URL<BA SEHREF="URL">必须放在「文头」区段内)

N2.0基本视窗名称 <BA SETA RGET="***">必须放在「文头」区段内)

相关性 <LINKREV="***"REL="***"HREF="URL">必须放在「文头」区段内)

背景资讯 <META >必须放在「文头」区段内)

HTML标签

HTML标签通常是英文词汇的全称(如块引用:blockquot或缩略语(如“p代表Paragragh但它与一般文本有区别,因为它放在单书名号里。故Paragragh标签是<p>,块引用标签是<blockquote>有些标签说明页面如何被格式化(例如,<p>开始一个新段落)其他则说明这些词如何显示(<b>使文字变粗)还有一些其他标签提供在页面上不显示的信息-例如标题。

关于标签,需要记住的成双出现的每当使用一个标签-如<blockquote>,则必须以另一个标签</blockquote>将它关闭。注意“blockquot前的斜杠,那就是关闭标签与打开标签的区别。

基本HTML页面以<html>标签开始,以</html>结束。之间,整个页面有两部分-标题和正文。

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

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

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

.<html></html>

2.<head></head>

3.<body></body>

4.<title></title>

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

1.<html></html>

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

2.<head></head>

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

3.<body></body>

<body></body>Html文档的主体部分,此标志对之间可包含<p></p><h1></h1><br><hr>等等众多的标志,所定义的文本、图像等将会在浏览器的框内显示出来。两个标志必须一块使用。<body>标志中还可以有以下属性:属性

用途

示例

<bodibgcolor="#rrggbb">设置背景颜色。<bodibgcolor="red">红色背景

<boditext="#rrggbb">设置文本颜色。<boditext="#0000ff">蓝色文本

<bodilink="#rrggbb">设置链接颜色。<bodilink="blue">链接为蓝色

<bodivlink="#rrggbb">设置已使用的链接的颜色。<bodivlink="#ff0000">

<bodialink="#rrggbb">设置正在被击中的链接的颜色。<bodialink="yellow">

说明:以上各个属性可以结合使用,如<bodibgcolor="red"text="#0000ff">引号内的rrggbb用六个十六进制数表示的RGB即红、绿、蓝三色的组合)颜色,如#ff0000对应的红色。此外,还可以使用Html语言所给定的常量名来表示颜色:BlackWhiteGreenMaroonOliveNaviPurplGraiYellowLimeAguaFuchsiaSilverRedBlue和Teal如<boditext="Blue">表示<body></body>标志对中的文本使用蓝色显示在浏览器的框内。

4.<title></title>

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

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

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

<html>

<head>

<title>显示在浏览器最上边蓝色条中的文本</title>

</head>

<bodibgcolor="red"text="blue">

<p>红色背景、蓝色文本</p>

</body>

</html>

1.<p></p>

2.<br>

3.<blockquote></blockquote>

4.<dl></dl><dt></dt><dd></dd>

5.<ol></ol><ul></ul><li></li>

6.<div></div>

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

1.<p></p>

<p></p>标志对是用来创建一个段落,此标志对之间加入的文本将按照段落的格式显示在浏览器上。另外,<p>标志还可以使用align属性,用来说明对齐方式,语法是<palign=""></p>align可以是Left左对齐)Center居中)和Right右对齐)三个值中的任何一个。如<palign="Center"></p>表示标志对中的文本使用居中的对齐方式。

2.<br>

<br>一个很简单的标志,没有结束标志,因为它用来创建一个回车换行,这么一说我想您该会使用了吧。<br>使用上还有一定的技巧,如果您把<br>加在<p></p>标志对的外边,将创建一个大的回车换行,即<br>前边和后边的文本的行与行之间的距离比较大,若放在<p></p>里边则<br>前边和后边的文本的行与行之间的距离将比较小,您不妨试试看。

3.<blockquote></blockquote>

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

4.<dl></dl><dt></dt><dd></dd>

<dl></dl>用来创建一个普通的列表,<dt></dt>用来创建列表中的上层项目,<dd></dd>用来创建列表中最下层项目,<dt></dt>和<dd></dd>都必须放在<dl></dl>标志对之间。看一下下边的例子您就会明白了

例2创建一个普通列表

<html>

<head>

<title>一个普通列表</title>

</head>

<boditext="blue">

<dl>

<dt>中国城市</dt>

<dd>北京 </dd>

<dd>上海 </dd>

<dd>广州 </dd>

<dt>美国城市</dt>

<dd>华盛顿 </dd>

<dd>芝加哥 </dd>

<dd>纽约 </dd>

</dl>

</body>

</html>

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

中国城市

北京

上海

广州

美国城市

华盛顿

芝加哥

纽约

5.<ol></ol><ul></ul><li></li>

<ol></ol>标志对用来创建一个标有数字的列表;<ul></ul>标志对用来创建一个标有圆点的列表;<li></li>标志对只能在<ol></ol>或<ul></ul>标志对之间使用,此标志对用来创建一个列表项,若<li></li>放在<ol></ol>之间则每个列表项加上一个数字,若在<ul></ul>之间则每个列表项加上一个圆点。请看下边的例子:

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

<html>

<head>

<title></title>

</head>

<boditext="blue">

<ol>

<p>中国城市 </p>

<li>北京 </li>

<li>上海 </li>

<li>广州 </li>

</ol>

<ul>

<p>美国城市 </p>

<li>华盛顿 </li>

<li>芝加哥 </li>

<li>纽约 </li>

</ul>

</body>

</html>

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

中国城市

北京

上海

广州

美国城市

华盛顿

芝加哥

纽约

6.<div></div>

<div></div>标志对用来排版大块Html段落,也用于格式化表,此标志对的用法与<p></p>标志对非常相似,同样有align对齐方式属性,读者可以自己试试看。

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

一、基本概念:

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

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

HTML内容怎样显示出来。

二、HTML语法:

<html></html>

<head></head>

<title></title>

<body></body>

三、<body>一些属性:

什么是属性:

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

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

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

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

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

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

leftmargin:左边距

topmargin:上边距

四、注释与特殊字符:

<!--.........-->

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

注释不能被嵌套。

<<

>>

&&

"'

注册符号

版权符号

"TM

空格

五、格式标签

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

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

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

<marquee></marquee>:移动图片或文本。direct属性:内容的移动方向(left,right,down,up;behavior指定内容的移动行为(scroll,alternate,slid

<dl></dl><dt></dt><dd></dd>用来创建一个普通列表。

<ol></ol><ul></ul><li></li>:<ol></ol>创建一个标有数字的列表;<ul></ul>对创建的列表标有一个圆点;<li></li>只能在<ol></ol>或<ul></ul>之间使用,表示列表项

<pre></pre>:对文本进行预格式处理

六、文本标签:

<h1></h1>......<h6></h6>:把文本以标题方式显示。

<b></b><i></i><u></u>:分别对应粗体,斜体,下划线

<sub></sub><sup></sup>:分别对应下上标的显示

<cite></cite>:引用方式的字体,通常是斜体

<em></em>:显示需要强调的文本,通常是斜体加粗

<strong></strong>:用来显示加重文本,通常是加粗显示

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

七、图像标签:

<img/>

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

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

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

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

width和height设置图像的长宽高

<hr/>:HTML文档中加入一条水平线。

size:线的粗细

color:线的色彩

width:线的长度

noshade:阴影显示

八、超链接标签:

通一资源定位符:URL;

如:http://www.sina.com

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

<ahref=""></a>:把中间标记的内容作为超链接显示,href内容作为超连接点击后转向的页面。

如:<ahref="http://www.sina.com">新浪网</a>

<ahref=http://www.hmttv.cn/uploadfile/2024/0807/20240807032253682.gif"></a>

href属性是不可少的

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

<aname="">锚点标记,同一网页中设置多个锚点便于超链接的浏览。

如:<ahref="#标记1">跳转到第一个标记上</a>

mailto:打开电子邮件:

<ahref="mailto:ldc_5588@163.comsubject=hello&body=您好">联系我</a>

九、<mapname=""></map>图像地图将一个图像分成多个部分,各部分分别指向不同的链接。

<areashape="形状"coords="坐标"href="url">给图像分块

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

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

poly:多边形,此时的coord为多边形的各个顶点

circle:圆,此时coord为圆习坐标及半径

如:

<imgsrc="chinagif"usemap="mymap"/>

<mapname=mymap>

<areashape="rect"href="a.html"coords="140,20,280,60">

<areashape="poly"href="b.html"coords="100,100,180,80,200,400">

<areashape="circle"href="c.html"coords="10,100,60">

</map>

十、表格标签:<table></table><tr></tr><td></td>

这三个标签的层次结构:

<table></table>定义一个表格的开始和结束

<tr></tr>定义一行的开始和结束

<td></td>定义一个单元格的开始和结束

<table></table>属性:

bgcolor:设置表格的背景色彩

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

bordercolor:设置表格边框色彩

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

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

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

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

width:表格的宽度

height:表格的高度

<tr></tr>

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

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

bgcolor:设置这一行的色彩

<td></td>

width:单元格的宽度(大小)

height:单元格的高度

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

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

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

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

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

<th></th>与<td></td>类似只不过里面显示的内容是黑体居中的

十一、框架标签<frameset></frameset><frame></frame>

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

框架只是分割窗口。

<frameset></frameset>定义一个框架集:

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

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

<frame></frame>定义一个具体的框架窗口:

src:要显示网页的URL

name:框架窗口的名子

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

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

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

<iframe></iframe>一个网上插入一个简单的框架窗口,这个窗口用来显示另一个文件。

name:框架窗口的名子

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

十二、表单标签:

什么时表单?

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

action:处理表单内容的服务器程序的URL

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

get:将表单信息以URL参数的形式附在actionURL后面

set:将表单信息以HTTP消息实体发送给WEB服务器

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

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

<inputtype="submit">定义一个提交按钮

action:指定URL所指定的服务器程序

value:按钮上的文字

<inputtype="reset">:定义一个重新填写的按钮。

value:按钮上的文字

<inputtype="text">:定义一个单行文本框

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

value:文本框的内容

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

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

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

<inputtype="checkbox">:定义一个复选框

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

checked:该复选框是否被选中

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

<inputtype="radio">:定义一个单选按钮

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

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

<inputtype="hidden">表单上添加一个隐式的字段的元素,浏览器不会显示这个字段

name:名子

value:值

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

<inputtype="button">:表单上定义一个普通的按钮,这个按钮通常与某个脚本代码下关联

<inputtype="password">:表单上定义一个密码输入区域.

<inputtype="file">:用来从本机向服务器传文件

<inputtype="image">:表单上创建一个图像元素。

图像的源文件由src属性来指定,没有valu属性。

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

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

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

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

mutipl属性:这是一个不且赋值的属性,定义列表框是否可以多选。

列表框中定义各项是用<option></option>来实现的

<option></option>为列表框中添加项目

value:项目的后台值

selected:指定项目是否被选定

<textarea></textarea>创建一个可输入多行文本的文本框

cols:文本框的列数

rows:文本框的列数

十三、分区标签:

<div></div>:区域标签,层

<span></span>:区域标签

十四、头元素:

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

该标签只能放在<head></head>标签之间。

如:<basehref="http://www.sina.com/image"target="_blank">

<meta>标签:通常用于文件的<head></head>之间。主要有两种类型的<meta>用不同的属性名(name,http-equiv来划分。

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

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

什么是HTTP头?

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

name属性的设置:

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

<metaname="keywords"content="软件工程师培训,清华IT,华育国际">

Descript网页描述信,以便于搜索。

Gener用于编辑此页所用的工具名,content中填入所用的网页编辑软件。

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

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

http-equiv属性设置:

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

<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">

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

<metahttp-equiv="Content-Type"content="1;url=http://www.sina.com.cn">

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

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

<metahttp_equiv="Expires"content=""Mon,12,May,200700:00:00GMT>

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

如何才能让你的网站与众不同?如何在成千上万的网站里表现出你的十足个性?一千个人有一千种说法。

在此,总结自己多年来做网站的经验和别人的建站技巧,谈一下建站的诸多窍门。

1.标题清晰,内涵显而易见

如今互联网上网站众多,只怕要数以亿计了,一个人一直不停的浏览也需要几十年才能看完,可见网站竞争非常激烈,即使同一种类型的网站,也有众多的竞争者。那么,如何在如此激烈的竞争中凸显出来呢?网站标题和栏目导航可谓承担了非常重大的责任。

任何一个人初次打开一个陌生网站都会思考下列问题:

这是什么网站?

网站上有什么?

我能在这里做什么?

为什么我应该选择这里,而不是其他地方?

你的网站便是要在第一时间为访客解决这些疑问。

网站名称一定要简单明了。比如说,你做的是建材行业的专业网站,那就直接命名为“某某建材网”,不要起一些非主流的名字,因为你做的是用来盈利的个人网站,而不是QQ空间。

网站构架一定要清晰,各个导航栏分类明确,次序井然。不要弄的跟迷宫一样,让人一看就眼花缭乱,不知从何处下手。那样的网站别人看一眼就立马走人了。如果网站内容较多,最好设置站内搜索功能,以方便用户查找。

用户是上帝。这句话对于网站站长来说同样有效。如果你的网站让用户感到麻烦,甚至是厌烦了,他们便会去找另一家同类网站。不要抱有侥幸心理,也不要做一些看似特立独行、别出心裁的网站页面。

相信我,越简单,越容易上手的网站,才越能得到用户的青睐。你看看百度的页面,看看hao123的页面,简单到只有一个个框框里的几行字而已。

2.关键词简洁有效

建设一个网站就要提高它的知名度,要提高知名度就要依靠搜索引擎,因为很多用户在不知道你网站的情况下是通过搜索引擎来查找的。既然这样,要想通过搜索引擎来提高流量,靠的是什么呢?是关键字。

关键字的选法可以说决定了你网站大半的命运。

(1)换位思考。

站在客户的角度考虑,客户在搜索你的产品时将使用什么关键词?这可以从众多资源中获得反馈,包括从你的客户、供应商、品牌经理和销售人员那里获知其想法。

(2)语义拓展。

将关键词扩展成一系列近义短语,选择其中比较适合的短语,用WordTracker进行检测,该软件的功能是查看你的关键词在其它网页中的使用频率,以及在过去24小时内各大搜索引擎上有多少人在搜索时使用过这些关键词。最好的关键词是那些没有被滥用而又很流行的词。

(3)专业词汇。

关键词一定要越专业越好,不要似是而非。要非常明确的表达出网站的功能,让专业人士在搜索的时候能够第一时间搜到你的网站。

(4)范围限定。

并不是说关键词概况的范围越大,越容易被搜到。而应该范围越小越好,越细越好。如果你是个地方性网站,关键词一定要体现这个地方的名称;如果是企业网站,一定要体现企业的品牌。

(5)修饰词组。

不要用单调的短语,比如说银行,你不能直接就设置银行作关键字,而应该进行修饰,到底是交通,是农业,还是工商呢?如果是工商,是工商的什么网站?信用卡购物?网上商城?

经常用搜索引擎的人应该知道,越贴近用户需求的关键词,越是会排在前面。比如你搜“电脑中病毒解决方法”,可能前三页大部分都是相应的解决办法,后面几页便是“电脑出问题怎么解决”,再往下就变成“病毒”,再往下就变成“电脑”,所以,精确而细致的关键词是非常重要的。

3.视觉效果

人们在阅读某种信息时,视觉总有一种自然的流动习惯,先看什么,后看什么,再看什么。心理学研究表明,一般的浏览习惯是从上到下、从左到右,在一个平面上,上松下稳而压抑。同样,平面的左松右稳。所以平面的视觉影响力上方强于下方,左侧强于右侧。这样平面的上部和中上部被称为“最佳视域”,也就是最优选的地方。在网页设计中一些突出或推荐的信息通常都放在这个位置。当然这种视觉流程只是一种感觉并非一种固定的公式,只要符合人们的心理顺序和逻辑顺序,就可以更为灵活地运用,在网页设计中,灵活而合理地运用直接影响到传达信息的准确性与有效性。

4.网页框架与布局

网页布局大致可分为“国”字型、拐角型、“T”字型、“L”字型、综合框架型、Flash型、变化型,在这里就不做一一论述了。其实我们在做设计的时候并没有过多地考虑什么形式,比如我们在一张纸上看到一个圆形的东西,很容易联想到它像太阳,而有些人则联想到月亮等等。这都是一种形式比喻,最重要的是抓住客户的需求,把握网站的定位做出合理的框架布局。

(1)分辨率。

网页的整体宽度可分为三种设置形式:百分比、像素、像素 百分比。通常在网站建设中以像素形式最为常用,行业网站也不例外。我们在设计网页的时候必定会考虑到分辨率的问题,科技发展到现在我们通常用的是1024×768和800×600的分辨率,现在网络上很多都用778个像素的宽度,在800的分辨率下面往往使整个网页很压抑,有种不透气的感觉,其实这个宽度是指在800×600的分辨率上网页的最宽宽度,不代表最佳视觉,不妨试试760~770的像素,不管在1024还是800的分辨率下都可以达到较佳的视觉效果。

(2)合理广告。

目前一些网站的广告(弹出广告、浮动广告、大广告、banner广告、通栏广告等等)让人觉得很繁琐,根本就不愿意看,有时干脆连这个网站都不上了。这样一来网站受到了严重的影响,广告也没达到广告的目的。这些问题都是我们在设计网站之前需要考虑、需要规划的内容之一。

浮动广告有两种,第一种是在网页两边空余的地方可以上下浮动的广告;第二种是满屏幕到处随机移动的广告。建议能使用第一种的情况下尽量使用第一种,不可避免第二种情况时尽量在数量上控制最多一个就好。如果数量过多会直接影响到用户的心理、妨碍到用户浏览信息,适得其反。首页广告不宜过多,适中即可。如在注册或者某个购买步骤的页面上,最好不要出现过多的其他无关内容让用户分心,避免客户流失等。

(3)空间的合理利用。

很多的网页都具有一个特点,用一个字来形容,那就是“塞”,它将各种各样的信息如文字、图片、动画等不加考虑的塞到页面上,有多少挤多少,不加以规范,导致浏览时会遇到很多的不方便,主要就是页面主次不分,喧宾夺主,要不就是没有重点,没有很好的归类,整体就像个大杂烩。让人难以找到需要的东西。有的则是一片空白失去平衡,也可以用个“散”字来形容。

并非要把整个页面塞满了才不觉得空,也并非让整个页面空旷才不觉得满,只要合理的安排、有机的组合,使页面达到平衡,即使在一边的部分大面积留空,同样不会让人感到空,相反这样会给人留下广阔的思考空间,给人回味又达到了视觉效果。

(4)文字编排。

在网页设计中,字体的处理与颜色、版式、图形化等其他设计元素的处理一样非常关键。

①文字图形化。

文字图形化就是将文字用图片的形式来表现,这种形式在页面的子栏目里面最为常用,因为它不仅突出,同时又美化了页面,使页面更加人性化且加强了视觉效果,是文字无法达到的。然而,对于通用性的网站,文字图形化就导致了弊端——扩展性不强。

②强调文字。

如果将个别文字作为页面的诉求重点,则可以通过加粗、加下划线、加大号字体、加指示性符号、倾斜字体、改变字体颜色等手段有意识地强化文字的视觉效果,使其在页面整体中显得出众而夺目。这些方法实际上都是运用了对比的法则。如果在更新频率低的情况下,也可以使文字图形化。

5.网站配色

(1)用一种色彩。

这里是指先选定一种色彩,然后调整透明度或者饱和度,说得通俗些就是将色彩变淡或者加深,产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。

(2)用两种色彩。

先选定一种色彩,然后选择它的对比色(在Photoshop里按ctrl shift I)再进行微小的调整。整个页面色彩丰富但不花哨。

(3)用一个色系。

简单地说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。也就是在同一色系里面采用不同的颜色使网页增加色彩,而又不花,色调统一。这种配色方法在网站设计中最为常用。

(4)灰色在网页设计中又称为“万能色”,其特点是可以和任何颜色搭配,在使用时把握量避免网页变灰。在网页配色中,尽量控制在三种色彩以内,以避免网页花、乱、没有主色的显现。背景和前文的对比尽量要大(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容、也使用户在浏览信息的时候不会觉得累。

6.网站LOGO

Logo顾名思义就是站点的标志图案,logo最重要的就是用图形化的方式传递网站的定位和经营理念,同时便于人们识别。网站logo的设计过程中一般有以下三种思路:(1)直接以网站网址作为logo。(2)根据网站提供的产品或服务特点展开logo设计。(3)以传递网站运营商的经营理念为特色。

7.签上自己的名字,并展示得到的荣誉

不要在这里弄上一个长长的签名,少许的自我宣传可能是中肯的,尤其是当你想让自己的网页具有个人特色时,但这可能会带来困窘,妨碍实质内容。你所要作的只是连接到关于作者的那一页,该页也是弃权、版权声明及类似说明的合适地方。要是有以评论或读者意见的形式取得的肯定性反馈,可考虑把它包括在主页之内。也许在开头的某个地方,或者作为到荣誉页的一个链接。如果做得恰到好处,可以鼓励新的访问者并使他们放心。相反,要是做得不合适,就会被认为是自我吹嘘,而真正的内容反而处于次要地位。

8.对用作背景的GIF要谨慎

它们可以使一个页面看起来很有趣,甚至很专业,但是装饰背景很容易使文字变得不可辨读,要把背景做得好,光有颜色对比是不够的。背景要么很亮(文字较暗)要么很暗(文字较亮)。背景含图像的对比度要较低才不至于过于分散读者的注意力。

使用交织GIF和JPEG。因为交织图像是分级显示出来的。首先以很低的分辨率显示,然后逐步提高分辨率,直至最后达到正常显示。这种方式有时候会使较大的图像看起来好像装载得快一些(实际上并非如此,但这是一种有益的错觉)。这样也便于读者在图像装载的过程中看到它的模样,如果他们不喜欢或不想看的话就有机会中断传输或转向别的地方。

9.在IMG行加ALT标记

假设标题图像显示为The Offal EatersHomepage,你可以在括号内加上一个ALT标记,ALT=“The Offal EatersHomepage”,直接把它加在IMGSRC=Offal。com。uk/images/gif/hometop。gif之后,这样就会让使用基于文本的浏览器读者除了看到「IMAGE」以外还能看到别的一些东西,使用图形浏览器的读者在图像未能成功载入之时也会看到一些东西,而你也能让自己的HTML文件相当整洁。也可以在分隔条上使用ALT标记,这样就使得用基于文本的浏览器的读者能看到一些更有趣的东西,而不只是一条直线。

10.巧用命令

一种增加可得带宽的巧妙方法是在HTML底稿中使用Lowsrc命令。比如说有一张400×600像素的1600万色扫描图,所占空间约为35K。使用Paint Shop Pro这一类的工具对原图重新取样,比如说高度为100像素(也许为了达到自己的要求,你得进行调整才能找到最合适的大小,但可以从高度除以4开始),Paint Shop Pro全自动计算新画面的宽度、保存新画面,它的大小现在应为6K或更小。然后在HTML文件中可以这样写上:

〈img src=“bigpic。jpg”lowsrc=“smallpic。jpg”width=“600”height=“400”〉

Lowsrc命令指示浏览器在真正的画面载入以前先装载低分辨率的图像,这样就让读者清楚将会出现什么样的画面。(为确保浏览器能即时以合适的大小显示图像,高度和宽度很重要。)

当然,可以用Lowsrc提取你想要的任何图像,一条双色的“请等待下传”的信息可能只占几百字节,同时由于图像是存在浏览器的缓存区,因此可用“请等待”信息代替所有画面,当图像平静地消失于背景之中的时候,读者可以悠闲地浏览你的网页。

也可以在一个HTML元素内嵌入一个连接,如:

〈H1〉〈A HREF=“Destina-tion。html”〉Myheading〈/A〉〈/H1〉

但不能反其道而行之,把一个标题或其他HTML元素嵌入一个连接,下面这样的结构是正式的HTML规定禁止的,并可能在大多数最新的浏览器下不见效果:

〈A HREF=“Destination。html”〉〈H1〉Myheading〈/H1〉〈/A〉

当然,做网站的窍门还有很多很多,每个人在运营过程中都会发现属于自己的一些技巧性东西,希望你也能提供出来,让大家一起分享。