Html语言代码标记知识

昵称1113461 2010-05-25

展开全文

好多朋友都刚接触博客，很多都不会，看着别人漂亮的博客非常羡慕。虽然很多博友在自己的博客里介绍了怎样制作博客，其实无非就是些代码翻来覆去的用，至于怎么用就是差别。要想建好自己的博客，就要先学习Html标示基本知识。下面我把整理的Html标示基本代码介绍给大家，供大家学习与参考。

一、基本标示代码

1、<htm>………. </htm> 标记整个文档

2、<head>……….</head> 标记初始信息,如标题、脚本，主要标记页头。包含6种命令：

（1）title 描述文档名称、定义网页标题（字符不能超过60个）

（2）lsindex 表明可对文档进行检索

（3）base 显示文档的原始URL

（4）Nexted 建立唯一的文档标示

（5）link 显示与其他文档的关系

（6）meta 镶入任何附加信息

如：<HTML.>

<Head>

</Head>

</HTML.> （1）title 描述文档名称、定义网页标题（字符不能超过60个）

（2）lsindex 表明可对文档进行检索

（3）base 显示文档的原始URL

（4）Nexted 建立唯一的文档标示

（5）link 显示与其他文档的关系

（6）meta 镶入任何附加信息

如：<HTML.>

<Head>

</Head>

</HTML.>

3、Body 标记正文。

由<Body>起到</Body>止正文结束。如：

<HTML.>

<Head>

</Head>

</HTML.>

如：<body>指令的属性

【1】背景颜色 -- bgcolor <body bgcolor=#rrggbb>

【2】背景图案 -- background <body background="图形文件名">

【3】设定背景图案不会卷动 -- bgproperties <body bgproperties=fixed>

【4】文件内容文字的颜色 -- text <body text=#rrggbb>

【5】超连结文字颜色 -- link <body link=#rrggbb>

【6】正被选取的超连结文字颜色 -- vlink <body vlink=#rrggbb>

【7】已连结过的超连结文字颜色 -- alink <body alink=#rrggbb>

4、Hn 标记文档正文标题

（n=1—6）代表文档标题级别H1最小，H6最大。

<HTML.>

<Head>

</Head>

</HTML.>

5、Font

(1)、字符标记

< Font>与Face,Size,Color组合指定字体.

如:<Font Face=”Arial,Sans”, Size=”4”, Color=”red”>文字</Font>

（2）、物理字符标记

〈B〉：粗体字〈I〉斜体字〈U〉下划线

〈SUP〉上标〈SUB〉下标

（3）段落标记

段落标记采用单个标记，没有结束符，〈BR〉产生回车键，〈P〉产生回车和一个空行。

（4）、段落对齐

1 .align 标记对齐属性，一般有：left左对齐，right右对齐，center居中对齐，justify两端对齐。

利用align属性设置的对齐方式只对当前行有效。

<HTML.>

<Head>

</Head>

<Body>

〈p align=left正文第一行〉

〈p align=left正文第二行〉

〈p align=left正文第三行〉

</Body>

</HTML.>

2 .DIV 对齐方式标记,如果有多个段落使用相同的对齐方式,可以不必每一行都用align标记属性,而用DIV标记,将所需的段落括起来,然后再在DIV中用align设置需要的对齐方式.如:

<HTML.>

<Head>

</Head>

<Body>

<P>正文第一行

〈P>正文第二行

〈P>正文第三行

〈p>正文第三行

</DIV>

</Body>

</HTML.>

3 .Hr 水平标尺标记,<Hr>作用是在标记处在屏幕内划一条水平线.如:

<HTML.>

<Head>

</Head>

<Body>

<Hr>

<P>正文第一行

〈P>正文第二行

〈P>正文第三行

〈p>正文第三行

</DIV>

</Body>

</HTML.>

这样就实现了:

正文标题

正文第一行

正文第二行

正文第三行

正文第四行

如：

【1】分隔线的粗细 <hr size=点数>

【2】分隔线的宽度 <hr size=点数或百分比>

【3】分隔线对齐方向 <hr align="#">

#号可为 left：表向左对齐（预设值） center：表向中对齐 right：表向右对齐

【4】分隔线的颜色 <hr color=#rrggbb>

【5】实心分隔线 <hr noshade>

4. width、height标示图片或文挡的宽度和高度。

6、音乐文件标示

src：音乐文件的URL；

hidden：=true为不可见，=false反之；

type：指定音频类型；

LOOP：是否循环播放，注意其值置于小角双引号中；

AUTOSTART：是否自动播放，其值同上

7、贴音乐代码：

2midi,asf,wma,asx类型的背景音乐代码：

8、加入连接：

<a href="所要连接的相关地址">写上你想写的字</a>

9、在新窗口打开连接：

<a href="相关地址" target="_blank">写上要写的字</a>

10、贴flash:

11、贴影视文件：

12、换帖子背景：

13、固定帖子背景不随滚动条滚动：

14、定制帖子背景颜色：

<body bgcolor="#value">(value值见10)

15、帖子背景音乐：

<bgsound="背景音乐地址" loop=infinite>

二、博客代码基础

（一）基本代码

1、贴图及图片效果：

（1）.插入图片 <img src="图片地址（或图形文件名）">

（2）.设定图框 -- border <img src="图形文件名" border=点数>

（3）.设定图形大小 -- width、height <img src="图形文件名" width=宽度点数 height=高度点数>

（4）.设定图形上下左右留空 -- vspace、hspace <img src="图形文件名" vspace=上下留空点数 hspace=左右留空点数>

（5）.图形附注 <img src="图形文件名" alt="说明文字">

（6）.预载图片

<img src="高解析度图形文件名" lowsrc="低解析度图形文件名"> P.S.两个图的图形大小最好一致;

（7）.影像地图（Image Map） <img src="图形文件名" usemap="#图的名称"> <map name="图的名称">

【1】定义形状 -- shape

shape=rect：矩形 shape=circle：圆形 shape=poly：多边形

【2】定义区域 -- coords

a.矩形：必须使用四个数字，前两个数字为左上角座标，后两个数字为右下角座标

例：<area shape=rect coords=100,50,200,75 href="URL">

b.圆形：必须使用三个数字，前两个数字为圆心的座标，最后一个数字为半径长度

例：<area shape=circle coords=85,155,30 href="URL">

c.任意图形（多边形）：将图形之每一转折点座标依序填入

例：<area shape=poly coords=232,70,285,70,300,90,250,90,200,78 href="URL"

图片的滤镜效果

准备:插入图片后进入"代码"模式,找到插入的图片代码域,对其进行修改.

找到相应的代码.为:

1.透明效果

格式:

涉及到的属性:修改数值对应即可

opacity:开始处的透明度

finishOpacity:结束处的透明度

style:0,平均透明 1,线状透明 2,圆形透明 3,菱形透明

2.翻转效果

左右翻转格式:

上下翻转格式:

3.变调效果

灰调格式:

4.X光效果:

色彩对换:

5.边框效果

发光:(color为发光颜色代码,strength是发光强度,滤镜宽=图宽+发光强度x2

滤镜高=图高+发光强度x2+10)

投影:(color为发光颜色代码,direction方向(只能是45度的倍数如:45,90,135,180,225,270,315度),滤镜宽=图宽+25) 滤鏡高=图高40)

阴影:(color为发光颜色代码,offX水平位移offY垂直位移(可正可负),滤镜宽=图宽+水平位移绝对值+10,滤镜高=图高+垂直位移绝对值+20)

模糊:(direction方向(只能是45度的倍数如:45,90,135,180,225,270,315度),滤镜宽=图宽+15,濾鏡高=图高+30)

波形:(freq频率(>0)strength振幅强度(>0)lightstrength波峰强度(0~100愈高越黑)phase起始相位(0~100),滤镜宽=图宽+振幅强度x2

滤镜高=图高+振幅强度x2+10)

6.图片加特效的具体添加部位：

<TBODY>

<TR>

7.文章的背景图代码：

在图片左边、右边插入文字：把图片放在文字的左边----------<P><IMG height=201 src="图片连接地址" width=154 align=left border=0><FONT face=Arial> 文字<BR> </FONT><BR clear=left></P>

把图片放在右边-----------------<P><IMG height=201 src="图片连接地址" width=154 align=right border=0><FONT face=Arial> 文字<BR> </FONT><BR clear=left></P>

8.把挂件贴在博客里

注意的是这个代码是带滤镜效果的,就是说会将图片反过来,如果不想带滤镜,那么将代码里的style="FILTER: FlipH"这段代码去掉就可以.代码里的所有RIGHT是管挂件在左或右的,全改LEFT或RIGHT就可以了.TOP:200PX管上下位置.

使用方法与背景音乐,鼠标的方法一样,控制面版,新建空白版,勾上源代码,复制进去代码,确定.再添加进首页,调整位置!

9.多幅带连接的图片移动：

<marquee scrollamount="1" scrolldelay="60" direction="up" width="200"

height="230"><div align="center"><a

href="连接的网页地址" target="_blank"><img

src="图片的地址" width="200" border="0" /></a> <a

href="连接的网页地址" target="_blank"><img

src="图片的地址" width="200" border="0" /></a> <a

href="连接的网页地址" target="_blank"><img

src="图片的地址" width="200" border="0" /></a> <a

href="连接的网页地址" target="_blank"><img

src="图片的地址" width="200" border="0" /></a>

......

动作如下：用法只将代码中direction="up"引号中的文字换成下面的动作代码简称就行。

方法：［例］direction="slide"

slide滑动

scroll预设卷动

alternate来回卷动

down向下卷动

up向上卷动

right向右卷动

left向左卷动

width=180设定宽度

height=30设定高度

10. 虚化图片代码:

<TBODY>

<TR>

11.加框有一层FLASH的图片

<TBODY>

<TR>

<TD>

贴一层Flash的效果：

代码如下：

<TBODY>

<TR>

贴两层透明Flash的效果，代码如下：

贴三层透明Flash效果，代码如下：

2、文字效果

移动字体

移动速度指令是: 最小为1，速度为最慢；数字越大移动的越快。

移动方向指令是：direction=# up向上、down向下、left向左、right向右。

指令举例：<MARQUEE scrollAmount=3 direction=up>..........</MARQUEE>

走马灯：

<marquee >写上你想写的字</marquee>

字体加粗：

<b>写上你想写的字</b>

字体斜体：

<i>写上你想写的字</i>

字体下划线:

<u>写上你想写的字</u>字体删除线: <s>写上你想写的字</s>

字体加大:

<big>写上你想写的字</big>

字体控制大小：

字体变化 <font>..........</font>

<h1>写上你想写的字</h1> (其中字体大小可从h1-h5,h1最大，h5最小)

【1】字体大小 <font size=#>..........</font> #=1~7；数字愈大字也愈大

【2】指定字型 <font face="字体名称">..........</font>

【3】标题文字 <h#>..........</h#> #=1~6；h1为最大字，h6为最小字

更改字体颜色：文字颜色 <font color=#rrggbb>..........</font>

rr：表红色（red）色码

gg：表绿色（green）色码

bb：表蓝色（blue）色码

rrggbb也可用6位颜色代码数字

<font color="#value">写上你想写的字</font>(其中value值在000000与ffffff(16位进制)之间

换行：<br>

段落：<p>段落</p>

原始文字样式：<pre>正文</pre>

消除连接的下划线：

<a href="相关地址" style="text-decoration:none">写上你想写的字</a>

文字的对齐方向 <p align="#"> #号可为 left：表向左对齐（预设值） center：表向中对齐 right：表向右对齐 P.S.<p align="#">之后的文字都会以所设的对齐方式显示，直到出现另一个<p align="#">改变其对齐方向，遇到<hr>或<h#>标签时会自动设回预设的向左对齐。

文字效果代码：

文字从背景中飞出来而且不影响本来的页面

把如下代码加入<body>区域中

// scroller message

var message="欢迎光临！请多提意见记得经常来看看呀你一定会有收获的 "

// fonts. Add as many fonts as you like.

var messagefont=new Array("Arial Black","Verdana","Impact","Comic Sans MS")

// fontcolors. Add as many fontcolors as you like.

var messagecolor=new Array("red","olive","888888","purple")

// horizontal and vertical position of scroller (pixels)

var positionleft=200

var positiontop=10

</SCRIPT>

var timer

var marginright=0

var i_fadestrength=5

var i_message=0

var i_messagecolor=0

var i_messagefont=0

var step=1

var maxfontsize=220

var fontsizefactor=maxfontsize/100

var content

var textboxwidth=0

var bodywidth=0

message=message.split(" ")

function setmessage() {if (i_message>=message.length) {i_message=0}

if (i_messagecolor>=messagecolor.length) {i_messagecolor=0}

if (i_messagefont>=messagefont.length) {i_messagefont=0}

content="<nobr><font color="+messagecolor[i_messagecolor]+" face="+messagefont[i_messagefont]+">"+message[i_message]+"</font><nobr>"

textbox.innerHTML=content

i_message++

i_messagecolor++

i_messagefont++

timer=setTimeout("resizemessage()",500)}

function resizemessage()

{if (i_fadestrength<120)

{textbox.filters.alpha.opacity=Math.floor(100-i_fadestrength)

document.all.textbox.style.fontSize=i_fadestrength*fontsizefactor

document.all.textbox.style.posLeft=positionleft-(Math.floor(i_fadestrength/1.1*fontsizefactor))

document.all.textbox.style.posTop=positiontop

document.all.textbox.style.width=bodywidth-document.all.textbox.style.posLeft-5

document.all.textbox.style.overflowX="hidden"

document.all.textbox.style.visibility="visible" step+=1.5 i_fadestrength+=step timer=setTimeout("resizemessage()",50)}

else {clearTimeout(timer) i_fadestrength=0; step=1; setmessage()}}

if (document.all)

{document.write("<DIV style=';font-family:Verdana;filter:alpha(opacity=0);'></DIV>")

document.write("<DIV style=';'>")}

if (document.all) {bodywidth=document.body.clientWidth-5 setmessage()}

</SCRIPT>

光晕效果文字代码

<DIV style="FILTER: glow(color=#ff6600,strength=6); COLOR: #000000; HEIGHT: 10px"><FONT size=5>要输入的文字</FONT></DIV>

滚动字代码

<marquee border="0" align="middle" scrolldelay="120">要输入的文字</marquee>

由中间向两边移动的文字

<MARQUEE width=200 height=50>填入由中间向两边移动的文字和图像</FONT></MARQUEE><FONT face=华文彩云 color=#ee110e size=5><FONT face=华文彩云 color=#ee1111 size=5>

<MARQUEE direction=right width=200 height=50>填入由中间向两边移动的文字和图像</FONT></MARQUEE></FONT></FONT></P></FONT>

文字左向右移动

<DIV imgzoom" scrollAmount=2 direction=right><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 30pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=隶书 color=#00ff00>要写的文字</FONT></MARQUEE>

文字向下移动

<MARQUEE scrollAmount=2 direction=down><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 30pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=隶书 color=#00ff00>要写的文字</FONT></MARQUEE>

文字向上移动

<MARQUEE scrollAmount=2 direction=up><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 30pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=隶书 color=#00ff00>要写的文字</FONT></MARQUEE>

文字跳舞

滚动字代码

<marquee border="0" align="middle" scrolldelay="120">要输入的文字</marquee>

发光文字代码：

<table style="FILTER: glow(color=#6699FF,direction=2)"><font color=#ffffff size=2>要修改的文字</font></table>

其中color是阴影的颜色，可以配合网页色调改变，direction是设置阴影的强度，font color是原字体的颜色。

浮雕的文字：

<table style="FILTER: dropshadow(color=#6699FF, offx=1, offy=1, positive=1);"><font color=#ffffff>要修改的文字</font></table>

其中color是阴影的颜色，可以配合网页色调改变，positive是设置阴影的强度，offx和offy是设置的阴影和文字的距离，font color是原字体的颜色。

阴影的文字：

<table style="FILTER: dropshadow(color=#cccccc, offx=2, offy=2, positive=2);"><font color=#6CABE7 size=2>要修改的文字</font></table>

插入表格

border：边框大小，0为不显示边框

bordercolor：边框颜色

bgcolor：表格背景颜色

tr：添加行

td：添加列

字在图片上向上移动的代码:

<TBODY>

<TR>

<CENTER><FONT style="FONT-SIZE: 20pt" face=华文新魏 color=#ffff00><B><BR>如水的夜色慢慢袭上来<BR>柔和的灯光<BR>散发出暧昧和诱惑<BR>CD里播放的是古筝曲<BR>凄美绝美缠绵悱恻的<BR>爱情故事<BR>正娓娓向我们道来<BR>如泣如诉<BR>在这静静的夜空<BR>如流苏般弥漫<BR>心情也随着乐曲跌跎起伏<BR><BR>博客教材在这里谢谢大家对我的支持<BR><BR></B></FONT></CENTER></MARQUEE></TD></TR></TOBDY></TBODY></TABLE>

字在虚化的图片上向上移动的代码

<TBODY>

<TR>

<CENTER><FONT style="FONT-SIZE: 20pt" face=华文新魏 color=#ffff00><B><BR>如水的夜色慢慢袭上来<BR>柔和的灯光<BR>散发出暧昧和诱惑<BR>CD里播放的是古筝曲<BR>凄美绝美缠绵悱恻的<BR>爱情故事<BR>正娓娓向我们道来<BR>如泣如诉<BR>在这静静的夜空<BR>如流苏般弥漫<BR>心情也随着乐曲跌跎起伏<BR><BR>延华天光欢迎您<BR><BR></B></FONT></CENTER></MARQUEE></TD></TR></TBODY></TABLE>

字在虚化的图片上移动并且有透明flash的代码

<TBODY>

<TR>

<CENTER><FONT style="FONT-SIZE: 20pt" face=华文新魏 color=#00ff00><B><BR>如水的夜色慢慢袭上来<BR>柔和的灯光<BR>散发出暧昧和诱惑<BR>CD里播放的是古筝曲<BR>凄美绝美缠绵悱恻的<BR>爱情故事<BR>正娓娓向我们道来<BR>如泣如诉<BR>在这静静的夜空<BR>如流苏般弥漫<BR>心情也随着乐曲跌跎起伏<BR><BR>延华天光欢迎您<BR><BR></B></FONT></CENTER></MARQUEE></TD></TR></TBODY></TABLE>

（二）制作滚动字幕

a)scrollAmount。它表示速度，值越大速度越快。如果没有它，默认为6，建议设为1～3比较好。

b)width和height，表示滚动区域的大小，width是宽度，height是高度。特别是在做垂直滚动的时候，一定要设height的值。

c)direction。表示滚动的方向，默认为从右向左：←←←。可选的值有right、down、up。滚动方向分别为：right表示→→→，up表示↑，down表示↓。

d)scrollDelay，这也是用来控制速度的，默认为90，值越大，速度越慢。通常scrollDelay是不需要设置的。

e)behavior。用它来控制属性，默认为循环滚动，可选的值有alternate(交替滚动)、slide(幻灯片效果，指的是滚动一次，然后停止滚动)

1.上下滚动：

代码：<MARQUEE style="FONT-SIZE: 12px; WIDTH: 132px; COLOR: rgb(34,34,221); LINE-HEIGHT: 17px; HEIGHT: 125px" scrollAmount=1 scrollDelay=1 direction=up height=125>这里是文字<BR></MARQUEE>

2.左右滚动：

代码：<marquee direction="left" scrollamount="1" scrolldelay="10" border="0" width=500 >

3.七彩文字背景

代码：<TABLE style=" HEIGHT: 140px" align=center background=http:///client/zcsl/200644152842607.GIF border=0>

<TBODY>

<TR>

<P><FONT style="FONT-SIZE: 38pt" face=华文行楷 color=#336699 size=7><B>要写的文字</B></FONT></P>

4.图片插入文字特效代码

<TBODY>

<TR>

<TD>

<MARQUEE scrollAmount=3 behavior=alternate width=750><IMG src="http:///client/zcsl/200644162842796.GIF"><FONT face=华文行楷 color=#800080 size=30><B><FONT face=楷体_GB2312 color=#00ffff>要写的文字</FONT><IMG src="http:///client/zcsl/200644162842796.GIF"></B></FONT></MARQUEE>

</MARQUEE></TD></TR></TBODY></TABLE>

5.带背景的往上浮动字：

<TBODY>

<TR>

</DIV></DIV></TD></TR></TBODY></TABLE></CENTER>

6.用图片做背景+字+FLASH+音乐

<TBODY>

<TR>

<TD><EMBED src=http://imgfree.21cn.com/free/flash/6.swf width=490 height=755 type=application/x-shockwave-flash

WMODE="transparent" MENU="false" QUALITY="high"></EMBED></TD></TR></TBODY></TABLE>

<TBODY>

<TR>

<DIV style="FILTER: glow(color=#66ffff strength=5); WIDTH: 90%; COLOR: white"><FONT style="FONT-SIZE: 24pt; FONT-

FAMILY: 华文新魏" color=#ffff66><B>我心为谁动我心为谁痛我心为谁把真爱奉送我心为谁动我心为谁痛我心为谁把伤心泪抛在风

中雨中让情和情相拥让心和心相通让刹那交织的眼神留住美丽的彩虹让真爱能永恒让美梦化成真让生命刻划的表情绽放灿烂的笑容笑

容我心为谁动我心为谁痛我心为谁把真爱奉送我心为谁动我心为谁痛我心为谁把伤心泪抛在风中雨中让血和血相容让心和心相通让巨

龙滚滚涌动着沉默的暴风让壮志在我胸让浩气架长空让一轮红日随我动试问天下谁与我争雄 </B></FONT></DIV>[wma]

http://www./mp3/heart.wma[/wma]</TD></TR></TBODY></TABLE></DIV></DIV></TD></TR></TBODY></TABLE></DIV>

（三）添加播放器

1、不使用播放器代码： <BGSOUND src="音乐文件地址" loop=infinite>

代码说明：蓝色部分为音乐文件的地址，由于此代码不使用播放器，所以可以加入文章中的源代码后，变成某个文章的背景音乐。

2、Windows Media Player:

代码：<DIV><OBJECT height=185 width=179 classid=CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6><PARAM VALUE="音乐文件地址"><PARAM VALUE="infinite"><PARAM VALUE="1"><PARAM VALUE="50"><PARAM VALUE="full"><PARAM VALUE="1"></OBJECT></DIV>

代码说明：蓝色部分为音乐文件的地址，绿色的数字表示是否自动播放，更改为"0"时不会自动播放，"1"的时候是自动播放。

3、透明播放器代码

<TBODY>

<TR>

4.万能播放器代码

代码说明：紫色部分为音乐文件的地址，蓝色数字闻为重复播放次数，可替换成你想要的数字，如果需要改成永久循环可以修改为"infinite"。

5、歌曲代码:

在这组代码中，不必管它是mms.http.rtsp，只要看尾缀是asf、wma、wmv、wmv、rm都可适用下面的代码:

1. 手动播放:

2. 打开页面自动播放:

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

套用代码:

<font face="华文彩云" size="6" color="#FFFFFF">歌曲或音乐名称</font><br><br>

</td></tr>

</table>

</div>

简易套用代码详解:

<div align="center">是定义帖子居中;

这其中的border="1"是定义表格边线的宽度,定义为0则无边线;width="90%" height="403"分别定义背景图表格的宽度和高度.如果背景图是一张大图,可以这样定义:width=图片宽度 height=图片高度

<p align="center"><br><br><br><font face="华文彩云" size="6" color="#FFFFFF">歌曲或音乐名称</font><br><br>

<p align="center">是定义文字居中的，<br>是回行代码，加几个就会空几行。<font face="华文彩云" size="6" color="#FFFFFF">是定义文字属性的。face="华文彩云"是定义字体，你可以把字体换成隶书、宋体等。size="6"是定义字号的，数字越大字越大，如果不定义，默认是2号字。color="#FFFFFF"是定义字体颜色的。全部字体颜色的代码在妙手饰图区有人发过，你可以找来改。

第一个括号里的代码仍然是定义图片和文字居中的。<img src="图片地址">是插入图片代码。<font color="#FFFFFF" size=3>介绍文字</font>是定义这段文字的。如果想改变字体颜色 color、字号size，只需要改动=后边的值即可。

这一段是插入播放器代码，因为我插的是特殊的播放器，style="FILTER: xray()" 是特殊代码。“src=音乐地址”是插入音乐文件的地址。width=250 height=30分别定义播放器的宽度和高度(如果把宽和高都设成零则为隐藏,并且只能自动播放)。autostart="true" loop="-1"是定义音乐播放方式的，autostart="true"是设定手动或自动播放，“true”或“1”是自动播放，“false”或“0”是手动播放；loop="-1"是播放次数，“true”或“1”表示重复播放，“false”“-1”或“0”是只播放一次。

<br><br><br></td></tr></table></div>回行代码和与前面对应的固定代码。

<br><br><br></td></tr></table></div>回行代码和与前面对应的固定代码。

（四）访问者停留时间计数器

编辑-排版-模块-添加自定义HTML 然后把 <p align=center>您在这里停留了代码1\2\3\.....贴上：

代码1.</p><p align=center><IMG height=20 src="http://album.sina.com.cn/pic/4723cdbf020002uq" width=15><IMG height=20 src="http://album.sina.com.cn/pic/4723cdbf020002up" width=15> 分 <IMG height=20 src="http://album.sina.com.cn/pic/4723cdbf020002uo" width=15><IMG height=20 src="http://album.sina.com.cn/pic/4723cdbf020002un" width=15> 秒</p> 复制上去

代码2. <DIV align=center><IMG height=73 src="http://album.sina.com.cn/pic/4723cdbf020002ub" width=32 border=0><IMG height=73 src="http://album.sina.com.cn/pic/4723cdbf020002uc" width=88 border=0><BR><IMG height=47 src="http://album.sina.com.cn/pic/4723cdbf020002ud" width=32 border=0><IMG height=47 src="http://album.sina.com.cn/pic/4723cdbf020002ue" width=88 border=0></DIV><BR>

代码3.<P><IMG src="http://img451./img451/5681/17sw.gif" border=0 width="67" height="70">

代码4.<IMG src="http://img451./img451/2654/26mf.gif" border=0 width="33" height="70">

代码5.<IMG src="http://img451./img451/7677/38qp.gif" border=0 width="33" height="70">

<代码6.IMG src="http://img451./img451/4378/42zs.gif" border=0 width="85" height="70"></P>

其中的"您在偶滴家家停留了:" 等等)

（五）友情连接

编辑-排版-模块-添加自定义HTML 然后把<marquee behavior="scroll" direction=right width="90%" height="100" scrollamount="2" scrolldelay="30" ><a target="cont" href="对方地址"><img src="对方图片" width="100" height="100" border="0"></a></marquee> 复制上去就行了.

要想加多个的话就把<a target="cont" href="对方地址"><img src="对方图片" width="100" height="100" border="0"></a> 加在最后那个</marquee>的前面

其中的 direction= 是图片移动方向 up、 down、 right 、left 任意添写

（六）首页flaish与日志里的flaish

1、首页flaish: 找到flaish地址后点编辑-排版-模块-添加自定义html- 点 Flash 复制进去就行了这个很简单

2、日志里的flaish: 好多朋友多说为什么我把代码粘贴到日志里但就是显示不出flaish呢? 我现在就告诉你因为你忘记点下面那个 <代码> 了必须先点一下代码后再复制上去.

日志里flaish的代码是:

（七）在你的博客上添加QQ

代码 <a target=blank href=tencent://message/?uin=405542906&Site=你的博克网址&Menu=yes><img border="0" SRC=http://wpa.qq.com/pa?p=1:你的QQ号码:1 alt="点击这里给我发消息"></a>

（八）个性名片

<table width="100%"><tr><td style="padding: 2px;"><img style="border: 1px solid rgb(153, 153, 153); width: 140px; height: 140px;"

src=头像图片地址></td><td valign="top"><table width="100%"><tr><td><img src="/style/common/gg.gif"></td></tr><tr><td><div style="font-weight: bold;font-size:16px;"><a href="邮箱地址">你的名字</a></div></td></tr><tr><td><div>年龄,星座</div></td></tr><tr><td><div>详细地址</div>

（九）显示来访者IP地址

（十）日志如何分类列表归档

原来常看到别人的日志分类列表归档，还有网站链接等，感到好博客的左边部分。其方法如下：

第一步：登录你的博客，进入“编辑我的博客”状态；

第二步：点击博客首页标题导航栏“收藏；

第三步：点击左下方的“个性列表”；

第四步：点击“创建”；

第五步：在“个性列表”框内填写上你的分类目录，如“我的日志”、“博客代码”等；

第六步：点击“添加项目”，在下方的“项目”一栏填写上你的文章的标题，在“地址”一栏填写上上面那篇文章在你博客中的网络地址，“描述”一项可不填，但有时需要输入一任意字符，然后擦除，再点击“确定”注意：为方便顺利起见，请在这步时，你重新再打开一个你的同一个博客，在刚打开的博客里复制日志名称、粘贴,复制网络地址、粘贴。

第七步：点击右上角“编辑或浏览我的博客”里面的“排版设置”、“内容模块”，在自“定义模块”里点击你新创建的那个分类目录浏览你的博客，已经大功告成了。另：如果要链接别人的博客，链接你认为好的网站，链接你在网上阅读了的好文章，方法参照（五）友情链接即可。

（十一）表格式导航栏代码

<tbody>

</tr></table></div>

十二、博客3D魔方像册

首先登陆这个网站:http://www./注册用户.

这个网站是全英文的,进入网站后,在网页的左上有一个"Sign up for free"的链接,点击进入，进入注册页面,下一步填写你自己的信息。

第一栏:选择一个用户名(不可以是已有的,填了后可以点后面括号里的提示,检测是否已被别人用了)

第二栏:设置密码.

第三栏:再次输入设置的密码

第四栏:填写你的e-mail地址

第五栏:填写你所在地的邮政编码

下面六七两栏是附加信息,分别填写你的出生年份(只是年份),和选择性别.

填完所有的注册信息,点击最下面的提交按钮.然后又跳到一个页面,上面显示"LAST STEP - FREE Sponsor Offers!"这是注册的最后一步,下面会有两个选项,一般都点"no"就可以了，再点下面的提交按钮,就算注册完成。

注册完,进入了相册管理页面,出现的是上传照片的页面,第一栏是选择一次性上传的照片张数,第二栏可以不用去管它,下面的就是选择你电脑上的照片上传了，选定了你要传的照片后,点下面的"Upload Pics Now!"。

上传完照片后,出现的页面,点击右边的"Creat a Photo Flik"链接.进入相册制作合成页面.

选择你的喜欢的一款3D相册,然后点最下面的"Continue"按钮.

下面是选择你所传的相片,一般超过你的最大选择张数会出现提示对话框.选择好相片后,同样点最下面的"Continue"按钮,进入最后阶段.

最后画面进入相册合成预览画面，在预览效果相册下面回有"Size Shown: Medium"这个小栏目，调节相册大小,和画面切换速度，选择完后,可以点下面的"Redisplay",刷新最下面的"Photo Flicks Posting Code",即:相册的脚本代码，一切OK后,就可以把脚本代码复制,粘贴到你的博客自定义HTML了。

下边是直接拿出来的代码，希望你能也做出漂亮的相册。

大家只要把图片地址换成你想要的图片，想要什么样式的就把FLASH地址改了就可以了，而且最下边提供了个通用的代码,可以让你自己添加修改的.

第一种：

第二种：<embed src="http://flash./pflicks/boxes_r.swf" loop="false" quality="high" FlashVars="logopath=http://flash./pflicks/ptlogo1.swf&ptdim=50.10&ptxy=450.16&hue=3&img1=http://pic20.:80/VOL1604/6811463/13084308/193649183.jpg&img2=http://pic20.:80/VOL1604/6811463/13084308/193649179.jpg&img3=http://pic20.:80/VOL1604/6811463/13084308/193649202.jpg&img4=http://pic20.:80/VOL1604/6811463/13084308/193649204.jpg&img5=http://pic20.:80/VOL1604/6811463/13084308/193649198.jpg&img6=http://pic20.:80/VOL1604/6811463/13084308/193649186.jpg&img7=http://pic20.:80/VOL1604/6811463/13084308/193649190.jpg&img8=http://pic20.:80/VOL1604/6811463/13084308/193649192.jpg&img9=http://pic20.:80/VOL1604/6811463/13084308/193649193.jpg" wmode="transparent" bgcolor="#ffffff" width="360" height="380" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

第三种：<embed src="http://flash./pflicks/m_bookhorizontal_r.swf" FlashVars="logopath=http://flash./pflicks/ptlogo1.swf&ptdim=50.10&ptxy=400.16&img1=http://pic20.:80/VOL1604/6811463/13084308/193649179.jpg&img2=http://pic20.:80/VOL1604/6811463/13084308/193649202.jpg&img3=http://pic20.:80/VOL1604/6811463/13084308/193649204.jpg&img4=http://pic20.:80/VOL1604/6811463/13084308/193649198.jpg&img5=http://pic20.:80/VOL1604/6811463/13084308/193649190.jpg&img6=http://pic20.:80/VOL1604/6811463/13084308/193649192.jpg&img7=http://pic20.:80/VOL1604/6811463/13084308/193649193.jpg&img8=http://pic20.:80/VOL1604/6811463/13084308/193649196.jpg" loop="false" quality="high" bgcolor="#ffffff" width="400" height="290" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

第四种：<embed src="http://flash./pflicks/l_cube_r.swf" loop="false" quality="high" FlashVars="logopath=http://flash./pflicks/ptlogo1.swf&ptdim=50.10&ptxy=284.16&img1=http://pic20.:80/VOL1604/6811463/13084308/193649179.jpg&img2=http://pic20.:80/VOL1604/6811463/13084308/193649202.jpg&img3=http://pic20.:80/VOL1604/6811463/13084308/193649204.jpg&img4=http://pic20.:80/VOL1604/6811463/13084308/193649190.jpg" wmode="transparent" bgcolor="#ffffff" width="400" height="300" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

第五种：<embed src="http://flash./pflicks/l_puzzle_r.swf" loop="false" quality="high" FlashVars="logopath=http://flash./pflicks/ptlogo1.swf&ptdim=50.10&ptxy=400.16&auto=1&wait=4&img1=http://pic20.:80/VOL1604/6811463/13084308/193649179.jpg&img2=http://pic20.:80/VOL1604/6811463/13084308/193649202.jpg&img3=http://pic20.:80/VOL1604/6811463/13084308/193649204.jpg&img4=http://pic20.:80/VOL1604/6811463/13084308/193649198.jpg&img5=http://pic20.:80/VOL1604/6811463/13084308/193649190.jpg&img6=http://pic20.:80/VOL1604/6811463/13084308/193649192.jpg&img7=http://pic20.:80/VOL1604/6811463/13084308/193649193.jpg&img8=http://pic20.:80/VOL1604/6811463/13084308/193649196.jpg" wmode="transparent" bgcolor="#ffffff" width="400" height="360" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

第六种：<embed src="http://flash./pflicks/l_geometric_r.swf" loop="false" quality="high" FlashVars="logopath=http://flash./pflicks/ptlogo1.swf&ptdim=50.10&ptxy=400.16&auto=1&wait=4&img1=http://pic20.:80/VOL1604/6811463/13084308/193649183.jpg&img2=http://pic20.:80/VOL1604/6811463/13084308/193649179.jpg&img3=http://pic20.:80/VOL1604/6811463/13084308/193649202.jpg&img4=http://pic20.:80/VOL1604/6811463/13084308/193649204.jpg&img5=http://pic20.:80/VOL1604/6811463/13084308/193649190.jpg&img6=http://pic20.:80/VOL1604/6811463/13084308/193649192.jpg&img7=http://pic20.:80/VOL1604/6811463/13084308/193649193.jpg&img8=http://pic20.:80/VOL1604/6811463/13084308/193649196.jpg" wmode="transparent" bgcolor="#ffffff" width="400" height="320" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

第七种：<embed src="http://flash./pflicks/l_kscope_r.swf" loop="false" quality="high" FlashVars="logopath=http://flash./pflicks/ptlogo1.swf&ptdim=50.10&ptxy=300.16&auto=1&wait=4&img1=http://pic20.:80/VOL1604/6811463/13084308/193649179.jpg&img2=http://pic20.:80/VOL1604/6811463/13084308/193649202.jpg&img3=http://pic20.:80/VOL1604/6811463/13084308/193649204.jpg&img4=http://pic20.:80/VOL1604/6811463/13084308/193649198.jpg&img5=http://pic20.:80/VOL1604/6811463/13084308/193649190.jpg&img6=http://pic20.:80/VOL1604/6811463/13084308/193649192.jpg&img7=http://pic20.:80/VOL1604/6811463/13084308/193649193.jpg" wmode="transparent" bgcolor="#ffffff" width="300" height="320" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>

第八种：

下边着个是通用的代码

大家只要把上面的图片地址换成你想要的图片，想要什么样式的就把FLASH地址改了就可以了.FLASH地址在上边那些代码中能找到.

代码如下：

<tr>

</tr>

</table></center>

将代码粘贴到源代码框，然后即可在图片上写文字，背景图会随着文字的增长而自动增长。

（十三）、表格相关

1.表格标题

表格标题位置 -- align

<caption align="#"> #号可为 top：表标题置于表格上方（预设值）

bottom：表标题置于表格下方

2.定义列 <tr>

3.定义栏位

《1》<td>：靠左对齐

《2》<th>：靠中对齐ⅱ粗体

【1】水平位置 -- align <th align="#">

#号可为 left：向左对齐 center：向中对齐 right：向右对齐

【2】垂直位置 -- align <th align="#"> #号可为

top：向上对齐 middle：向中对齐 bottom：向下对齐

【3】栏位宽度 -- width <th width=点数或百分比>

【4】栏位垂直合并 -- rowspan <th rowspan=欲合并栏位数>

【5】栏位横向合并 -- colspan <th colspan=欲合并栏位数>

4、表格的主要属性

【1】. <table>标记的主要属性

align定义表格的对齐方式，有三个属性值center，left，right

background定义表格的背景图案，属性值为图片的地址

bgcolor定义表格的背景颜色，属性值是各种颜色代码

border定义表格的边框宽度，属性值是数字

bordercolor定义表格边框的颜色，属性值是各种颜色代码

cellpadding定义单元格内容与单元格边框之间的距离，属性值是数字

cellspacing定义表格中单元格之间的距离

height定义表格的高度，属性值是数字

width定义表格的宽度，属性值是数字

【2】. <tr>标记，表格是由多行与多列组成的，<tr>标记用来定义表格的一行，他的属性极其属性值定义的是表格中的该行，其主要属性与属性值如下：

align定义对齐方式，属性值与上同

background定义背景图案 bgcolor定义背景色

【3】. <td>标记。用<td>标记概况起来的内容表示表格的单元。其主要属性与属性值和<table>标记的一样，补充两个合并列和行的代码：

colspan定义合并表格的列数，属性值是数字

rowspan定义合并表格的行数，属性值是数字

（十四）、FRAME

1、分割视窗指令 <frameset>..........</frameset>

【1】垂直（上下）分割 -- rows

<frameset rows=#> #号可为点数：

如欲分割为100,200,300三个视窗，则<frameset rows=100,200,300>；

亦可以*号代表，如<frameset rows=*,500,*>

百分比：如<frameset rows=30%,70%>，各项总和最好为100%;

【2】水平（左右）分割 -- cols <frameset cols=点数或百分比>

2、指定视窗内容 -- <frame>

【1】指定视窗的文件名称 -- src <frame src=HTML档名>

【2】定义视窗的名称 -- name

<frame

【3】设定文件与上下边框的距离 -- marginheight

【4】设定文件与左右边框的距离 -- marginwidth

【5】设定分割视窗卷轴 -- scrolling

<frame scrolling=#> #号可为 yes：固定出现卷轴

no：不出现卷轴

auto：自动判断文件大小需不需要卷轴（预设值）

【6】锁住分割视窗的大小 -- noresize <frame noresize>

以上内容是有本人有有关书籍和网络中网友的博客中整理归纳,主要是为了更多的网友了解HTML知识,把博客做的更靓,延华天光希望对网友有所帮助,多提意见!

本站是提供个人知识管理的网络存储空间，所有内容均由用户发布，不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息，谨防诈骗。如发现有害或侵权内容，请点击一键举报。

转藏分享

QQ空间 QQ好友新浪微博微信

献花（0） +1

来自：昵称1113461 > 《HTML代码》

举报/认领

0条评论

发表

请遵守用户评论公约

类似文章 更多

昵称1113461

关注对话

TA的最新馆藏

[转] 木工工具使用---手工凿及其使用
[转] 木工基础：磨刀技术要领
[转] 【手工制作DIY】手工制作利用废旧电池为LED灯供电
[转] Rob教你八分钟手工打造完美燕尾榫
[转] [木工制作]简单对接-木工接合手册2
[转] [木工制作]木工接合基础-木工接合手册1

喜欢该文的人也喜欢更多

热门阅读换一换