★*★≈^*代码汇编*^≈★*★

教程汇总

P> ­

冰雨飘飘教程空间真诚谢谢您的光临

 

 

 



 

用代码做漂亮的日志


 

一、HRML在线编辑器地址:

[url=http://ny.xmu.edu.cn/editor.asp]http:

//ny.xmu.edu.cn/editor.asp[/url]



图片

 

打开编辑器,点上面最下一排第9个

符号插入表格,如下设置


图片
最上面四组就按图片上设置,单元间距和单

元边框是这张图片显示多宽,

可以随你的想法输入,一般线条的宽输入1P

X到10PX就可以了,在

背景图片”那儿插入你想放上去的图片地

址。点确定后,

桌面上出现编辑的状态,然后在图片上插入

光标,如果不能插上光标,

就在左下角点一下源码在点回编辑,就可以

了,插上光标后跟做第一层

一样的,可以根据自己的喜欢放第二层,第三

层等很多层的图片,宽度

也自己掌握。做好边框如下:



图片然后把上面边框宽的部份删一些跟左右一样,

下面不用管,鼠标插在

图片的中间,向下击回车键,就能看出

边框的

效果了,或者点下面的

预览也行。 效果如下:


图片然后点击下面的源代码(在编辑器的左下方)

,复制全部代码,到你

空间的写日志地方,点开高级,打开

>HTML

编辑,把代码粘贴上去。在粘贴前要把里面的

符号全部删掉,那样才

会显示正确。

 


图片
图片

然后在右上角有一个返回,点击返回,就可

以看到效果,然后在边

框中间写日志和加上你喜欢的图片就行了。

朋友们喜欢日志做多长,

就敲击回车键。边框会自然往下延伸的。
 

二、下面的代码都是在HTML的编辑状态下

使用的

1、字在图片上流动的代码    

 <DIV> <TABLE style="WIDTH: 380px; HEI

GHT: 256px" width=380 border=0> <TBODY>

<TR> <TD background=图片地址 height=250>

<P> <MARQUEE style="WIDTH: 365px; HEI

GHT: 238px" scrollAmount=1 scrollDelay=50

 direction=up width=365 height=238>图片上

的文字</MARQUEE></P></TD></TR></TB

ODY>
背景音乐代码
2、免费播放器的加法:

</textarea><embed src=http://你的背景音

乐地址 width=0 height=0 loop=

true>  

(此代码不显播放器)

</textarea><embed src=http://你的背景

音乐地址 width=2 height=2 loop= true> 

  (此代码显播放器)
3、 图片羽化代码:

圆形渐变透明代码

     <center><img src="图片地址" style=

"filter=alpha(opacity=100,style=2,finish

 

opacity=0)"></center>
X形渐变透明代码

     <center><img src="图片地址" style=

"filter=alpha(opacity=100,style=3,finish

opacity=0)"></center>

字体滚动代码 

    <MARQUEE behavior=alternate>输入

的内容</MARQUEE>
图片动的羽化代码 

   <marquee behavior=alternate><BR>
<img src="这里放图的地址" style="FILTER:

 alpha(opacity=100,style=2)"width=300><BR>
</marquee></p>

 方形羽化代码 <CENTER><img src=

"这里放图地址" style="FILTER: alpha

(opacity=100,style=2)"width=300>
</CENTER>

多张图片滚动代码:
<TABLE cellSpacing=0 cellPadding=0

 width="70%" align=center border=0>
<TBODY>
<TR>
<TD align=middle>
<MARQUEE>
<P align=center><IMG src="图地址">

</P></MARQUEE></TD>
<TD align=middle>
<MARQUEE>
<P align=center><IMG src="图地址">

</P></MARQUEE></TD>
<TD align=middle>
<MARQUEE>
<P align=center><IMG src="图地址"><

/P></MARQUEE></TD>
<TD align=middle>
<MARQUEE>
<P align=center><IMG src="图地址">

</P></MARQUEE></TD></TR></TB

ODY></TABLE></P>

 

三、几款图片边框代码

 

1、虚线边框效果 代码如下:

 
图片

 

代码如下:
<TABLE style="BORDER-RIGHT: #9900ff

5px dashed; BORDER-TOP: #9900ff 5px da

shed; BORDER-LEFT: #9900ff 5px dashed;

 BORDER-BOTTOM: #9900ff 5px dashed" c

ellSpacing=0 cellPadding=0 align=center

border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"> </TD></TR><

/TBODY></TABLE>

2、多层虚线边框效果: 代码如下:

 
图片

 

代码如下:

<TABLE style="BORDER-RIGHT: #9900ff

5px dashed; BORDER-TOP: #9900ff 5px

dashed; BORDER-LEFT: #9900ff 5px dash

ed; BORDER-BOTTOM: #9900ff 5px dashed

" cellSpacing=0 cellPadding=0 align=center

 border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #FF6600

 10px dashed; BORDER-TOP: #FF6600 10

px dashed; BORDER-LEFT: #FF6600 10px

 dashed; BORDER-BOTTOM: #FF6600 10px

dashed" cellSpacing=0 cellPadding=0 align

=center border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #9900ff

5px dashed; BORDER-TOP: #9900ff 5px

dashed; BORDER-LEFT: #9900ff 5px dash

ed; BORDER-BOTTOM: #9900ff 5px dashed"

 cellSpacing=0 cellPadding=0 align=center

 border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></TR></

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

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

3、点虚线边框效果 边框风格属性dotted:

点虚线 代码如下:

 
图片

 

代码如下:
<TABLE style="BORDER-RIGHT: #9900ff

10px dotted; BORDER-TOP: #9900ff 10px

dotted; BORDER-LEFT: #9900ff 10px dott

ed; BORDER-BOTTOM: #9900ff 10px dotted"

cellSpacing=0 cellPadding=0 align=center b

order=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"> </TD></TR></

TBODY></TABLE>

4、多层点虚线边框效果代码如下:

 
图片

 

<TABLE style="BORDER-RIGHT: #9900ff

5px dotted; BORDER-TOP: #9900ff 5px dot

ted; BORDER-LEFT: #9900ff 5px dotted; BOR

DER-BOTTOM: #9900ff 5px dotted" cellSpaci

ng=0 cellPadding=0 align=center border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #FF6600

10px dotted; BORDER-TOP: #FF6600 10px

dotted; BORDER-LEFT: #FF6600 10px dot

ted; BORDER-BOTTOM: #FF6600 10px do

tted" cellSpacing=0 cellPadding=0 align=c

enter border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #9900ff

5px dotted; BORDER-TOP: #9900ff 5px do

tted; BORDER-LEFT: #9900ff 5px dotted; B

 

ORDER-BOTTOM: #9900ff 5px dotted" cellS

pacing=0 cellPadding=0 align=center bo

rder=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></TR></TBO

DY></TABLE></TD></TR></TBODY></TABLE

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

5、实线边框效果. 这个实线边框不用CSS语言也

能实现. 代码如下:

 
图片

 

代码如下:

<TABLE style="BORDER-RIGHT: #9900ff

10px solid; BORDER-TOP: #9900ff 10px

solid; BORDER-LEFT: #9900ff 10px solid;

 BORDER-BOTTOM: #9900ff 10px solid" ce

llSpacing=0 cellPadding=0 align=center

 border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></TR></

TBODY></TABLE>

6、:双线边框效果 边框风格属性double:

双线边框 代码如下:

 
图片

 

代码如下:

<TABLE style="BORDER-RIGHT: #9900ff

10px double; BORDER-TOP: #9900ff 10px

 double; BORDER-LEFT: #9900ff 10px d

ouble; BORDER-BOTTOM: #9900ff 10px double"

cellSpacing=0 cellPadding=0 align=center

 border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></TR></T

BODY></TABLE>

7、双线边框效果代码如下:

 
图片

 

<TABLE style="BORDER-RIGHT: #9900ff

 5px double; BORDER-TOP: #9900ff 5px

 double; BORDER-LEFT: #9900ff 5px dou

ble; BORDER-BOTTOM: #9900ff 5px dou

ble" cellSpacing=0 cellPadding=0 align=cen

ter border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #FF6600

10px double; BORDER-TOP: #FF6600 10px

double; BORDER-LEFT: #FF6600 10px dou

ble; BORDER-BOTTOM: #FF6600 10px

double" cellSpacing=0 cellPadding=0

align=center border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #9900ff

5px double; BORDER-TOP: #9900ff 5px

double; BORDER-LEFT: #9900ff 5px do

uble; BORDER-BOTTOM: #9900ff 5px d

ouble" cellSpacing=0 cellPadding=0 alig

n=center border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></TR>

</TBODY></TABLE></TD></TR></T

BODY></TABLE></TD></TR></TB

ODY></TABLE>

8、双线,短虚线混用效果

代码如下:

 
图片

 

<TABLE style="BORDER-RIGHT: #9

900ff 8px double; BORDER-TOP: #99

00ff 8px double; BORDER-LEFT: #99

00ff 8px double; BORDER-BOTTOM:

#9900ff 8px double" cellSpacing=0

cellPadding=0 align=center

border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT:

#FF6600 15px dashed; BORDER-TOP:

#FF6600 15px dashed; BORDER-LEFT:

#FF6600 15px dashed; BORDER-BOTT

OM: #FF6600 15px dashed" cellSpacin

g=0 cellPadding=0 align=center

 border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #99

00ff 5px double; BORDER-TOP: #990

0ff 5px double; BORDER-LEFT: #9900

ff 5px double; BORDER-BOTTOM: #99

00ff 5px double" cellSpacing=0 cellPa

dding=0 align=center border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></

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

</TBODY></TABLE></TD></TR></TB

ODY></TABLE>

9、双线,点虚线混用效果 代码如下:

图片 

 

代码如下:

<TABLE style="BORDER-RIGHT: #9

900ff 8px double; BORDER-TOP: #9

900ff 8px double; BORDER-LEFT: #9

900ff 8px double; BORDER-BOTTOM:

#9900ff 8px double" cellSpacing=0 ce

llPadding=0 align=center border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #FF

6600 15px dotted; BORDER-TOP: #FF

6600 15px dotted; BORDER-LEFT: #FF

6600 15px dotted; BORDER-BOTTOM:

#FF6600 15px dotted" cellSpacing=0 ce

llPadding=0 align=center bord

er=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #990

0ff 5px double; BORDER-TOP: #9900ff

5px double; BORDER-LEFT: #9900ff 5

px double; BORDER-BOTTOM: #9900ff

 5px double" cellSpacing=0 cellPaddin

g=0 align=center border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></TR>

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

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

TABLE>

10、3D 沟槽状边框效果 边框凤格属性g

roove:3D 沟槽状 代码如下:

 图片

 

<TABLE style="BORDER-RIGHT: #6F8A91

 20px groove; BORDER-TOP: #6F8A91 20p

x groove; BORDER-LEFT: #6F8A91 20px gro

ove; BORDER-BOTTOM: #6F8A91 20px groo

ve" cellSpacing=0 cellPadding=0 align=cen

ter border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></TR></T

BODY></TABLE>

11、多层3D 沟槽状边框效果 代码如下:

 
图片

 

<TABLE style="BORDER-RIGHT: #6f8a91

8px groove; BORDER-TOP: #6f8a91 8px g

roove; BORDER-LEFT: #6f8a91 8px groov

e; BORDER-BOTTOM: #6f8a91 8px groove"

 cellSpacing=0 cellPadding=0 align=center

border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #6f8a91

15px groove; BORDER-TOP: #6f8a91 15px

 groove; BORDER-LEFT: #6f8a91 15px gr

oove; BORDER-BOTTOM: #6f8a91 15px gr

oove" cellSpacing=0 cellPadding=0 align=

center border=0>
<TBODY>
<TR>
<TD>
<TABLE style="BORDER-RIGHT: #6f8a91 5

px groove; BORDER-TOP: #6f8a91 5px gr

oove; BORDER-LEFT: #6f8a91 5px groov

e; BORDER-BOTTOM: #6f8a91 5px groov

e" cellSpacing=0 cellPadding=0 align=ce

nter border=0>
<TBODY>
<TR>
<TD><IMG src="图片地址"></TD></TR></

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

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

TABLE>

12、3D 脊状边框效果 边框凤格属性ridge:

3D 脊状 代码如下:

文章评论