登录  
 加关注
查看详情
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

.

.

 
 
 

日志

 
 
关于我

艺轩古建彩画部, 彩绘贴金古装饰, 继承传统又创新, 信誉质量拓新路!............ 网上博客古艺轩, 休闲之余来开心, 搜集资料和学习, 相互交流结福缘!

教程:如何在图片中加入文字?  

2009-01-22 08:57:56|  分类: 【代码素材】 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

引用

玫瑰夫人教程:如何在图片中加入文字?

一、插入背景图片

<TABLE align=center background="背景图" border=0 cellPadding=0 cellSpacing=0 borderColor=#ffff00 width="100%"><TBODY><TR><TD>
内容,文字或图片.....
</TD></TR></TBODY></TABLE>


 <TABLE> 的参数设定(常用):

<table width="400" border="1" cellspacing="2" cellpadding="2" align="CENTER" valign="TOP" background="myweb.gif" bgcolor="#0000FF" bordercolor="#CF0000" bordercolorlight="#00FF00" bordercolordark="#00FFFF" cols="2">


 注解:

width="400"
表格宽度,接受绝对值(如 80)及相对值(如 80%)。
border="1"
表格边框的厚度,不同浏览器有不同的内定值,故请指明。
cellspacing="2"
表格格线的厚度
align="CENTER"
表格的摆放位置(水平),可选值为: left, right, center
valign="TOP".
表格里内容的对齐方式(垂直),可选值为: top, middle, bottom。
background="myweb.gif"
表格的背景图片,与 bgcolor 不要同用。
bgcolor="#0000FF"
表格的底色,与 background 不要同用
bordercolor="#CF0000"
表格边框颜色
bordercolorlight="#00FF00"
表格边框向光部分的颜色
bordercolordark="#00FFFF"
表格边框背光部分的颜色,使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。
cols="2"
表格栏位数目,只是让浏览器在下载表格时先画出整个表格而已。

二、日志上放图片: 

<img src="地址"; width="480" height="360">

图片居中代码:

<DIV align=center>代码</DIV>

说明:

将其中的center换为left或者right即为居左或居右

三、图片链接移动代码:

例1:

<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></div><div align="center"><a href=第二个连接网址 target="_blank"><img src="第二张图片地址" width="200" border="0" /></a></div></marquee>

例2:

<marquee direction=left width=宽度>
<img src="
你的图片地址">
<img src="
你的图片地址">
<img src="
你的图片地址">
<img src="
你的图片地址">
</marquee>

例3:

<marquee width=100% behavior=alternate><img src="你的图片"></marquee>

说明:

以次类推,可以加很多张图片,注意要加在最后一个</marquee>前面,就不会丢失移动效果。

四、图片的滤镜效果

1.透明效果:(两种都可)

 

 

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

 

<img src="图片地址" style="filter:Alpha(opacity=100,finishOpacity=0,style=0)">

<div style="filter:Alpha(opacity=100,finishOpacity=0,style=0) ;width:宽;height:高"><img src="图片地址"></div>


注解:

涉及到的属性:修改数值对应即可
opacity:开始处的透明度
finishOpacity:结束处的透明度
style:0,平均透明 1,线状透明 2,圆形透明 3,菱形透明

2.翻转效果:

(1)左右翻转格式

: 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<img src="图片地址" style="filter:FlipH">

<div style="filter:FlipH ;width:宽;height:高"><img src="图片地址"></div>

(2)上下翻转格式

: 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<img src="图片地址" style="filter:FlipV">

<div style="filter:FlipV ;width:宽;height:高"><img src="图片地址"></div>


3.变调效果
(1)灰调格式

: 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<img src="图片地址" style="filter:Gray">

<div style="filter:Gray ;width:宽;height:高"><img src="图片地址"></div>

(2)X光效果:

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<img src="图片地址" style="filter:Xray">

<div style="filter:Xray ;width:宽;height:高"><img src="图片地址"></div>


(3)色彩对换:

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<img src="图片地址" style="filter:Invert">

<div style="filter:Invert ;width:宽;height:高"><img src="图片地址"></div>

4.边框效果:

(1)发光边框:


 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<div style="filter:Glow(color=#4A7AC9,strength=15);width:滤镜宽;height:滤镜高" align=center><br><img src="图片地址"></div>

说明:

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

(2)投影边框:


 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<div style="filter:Shadow(color=#4A7AC9,direction=135);width:滤镜宽;height:滤镜高" align=center><br><img src="图片地址"></div>

说明:

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

(3)阴影边框:


 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<div style="filter:Dropshadow(color=#333333,offX=5,offY=5);width:滤镜宽;height:滤镜高" align=center><br><img src="图片地址"></div>

说明:

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

(4)模糊:


 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<div style="filter:Blur(direction=135);width:滤镜宽;height:滤镜高" align=center><br><img src="图片地址"></div>

说明:

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

(5)波形:


 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<div style="filter:Wave(freq=7,strength=9,lightstrength=5,phase=5);width:滤镜宽;height:滤镜高" align=center><br><img src="图片地址"></div>

说明:

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

五、CSS滤镜实现图片特效(模糊倒影+雾化+多层FLASH特效+百叶窗)

1.图片静态倒影代码

 教程:如何在图片中加入文字? -   * 古艺轩 * - .
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

<P align=center><IMG height=高度 src="图片地址" width=宽度><BR><IMG style="FILTER: wave
(strength=3,freq=3,phase=0,lightstrength=30) blur() flipv()" height=高度 src="
图片地址" width=宽度> </p>

说明:

修改其中的图片地址和高度宽度即可。

 2.给图片加多层FLASH特效代码

<P align=center>
<TABLE height=表格高度 cellSpacing=0 cellPadding=0 width=宽度 background=图片地址 border=0>
<TBODY>
<TR>
<TD><EMBED align=right src=第一个FLASH地址 width=宽 height=高 type=application/octet-stream wmode="transparent" quality="high" ;;><EMBED align=right src=第二个地址 width=400 height=300 type=application/octet-stream wmode="transparent" quality="high" ;;>.......以此类推</EMBED></TD></TR></TBODY></TABLE></P>

说明:

修改代码中的汉字为自己想要的。

3.图片雾化效果

< TD>

 

<P align=center>
                        <TABLE border=0>
                        <TBODY>
                        <TR>
                        <TD style="FILTER: Alpha(opacity=100,style=2)"
                        width=420
                        background=图片地址
                        height=296
                        </TD></TR></TOBDY></TBODY></TABLE></P>

4.图片百叶窗特效

 

 教程:如何在图片中加入文字? -   * 古艺轩 * - .  教程:如何在图片中加入文字? -   * 古艺轩 * - .  教程:如何在图片中加入文字? -   * 古艺轩 * - .  教程:如何在图片中加入文字? -   * 古艺轩 * - .

<TABLE cellSpacing=0 cellPadding=0 width="70%" align=center border=0>
<TBODY>
<TR>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=120><IMG src="第一个图片地址
"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=120><IMG src="第二个图片地址
"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=120><IMG src="第三个图片地址
"></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=120><IMG src="第四个图片地址
"></MARQUEE></TD></TR></TBODY></TABLE>

说明:

修改代码中的汉字为自己想要的。调整scrollDelay=100 可以调整滑动速度

 

========================

图片加框代码:

1.单线框
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<center><img src="图片地址" style="border:3 solid #ff0000"><br><br><br></center>

2.双线框
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<center>
<img src="图片地址" width=180 height=130 style="border:5 double green"><br><br><br></center>

3.凸出框
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<center>
<img src="图片地址"style="border:25 outset #ff88ff"><br><br><br></center>

4.凹进框
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<center> <img src="图片地址" style="border:25 inset #ff88ff"><br></center>

5.邮票框
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<TABLE style="BORDER-RIGHT: #f6ae56 3px dashed; BORDER-TOP: #f6ae56 3px dashed; BORDER-LEFT: #f6ae56 3px dashed; WIDTH: 256px; BORDER-BOTTOM: #f6ae56 3px dashed; HEIGHT: 200px" cellSpacing=5 cellPadding=0 bgColor=#f6ae56>
<TBODY>
<TR>
<TD vAlign=center align=middle height=200><FONT size=4><IMG style="WIDTH: 239px; HEIGHT: 195px" height=185 src="图片地址" width=239></FONT></TD></TR></TBODY></TABLE>

6.虚线框

 教程:如何在图片中加入文字? -   * 古艺轩 * - .
 

复制语法区

<CENTER><IMG style="BORDER-RIGHT: #ff0000 4px dashed; BORDER-TOP: #ff0000 4px dashed; BORDER-LEFT: #ff0000 4px dashed; BORDER-BOTTOM: #ff0000 4px dashed" src="图片地址"><BR><BR><BR></CENTER>

7.凹槽框
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<center>
<img src="图片地址" style="border:25 groove green" border="0"><br><br><br></center>

 8.立体阴影框
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<CENTER>
<TABLE style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#f6ae56,direction:145,strength:15)" height=400 cellSpacing=3 cellPadding=15 width=400 border=2>
<TBODY>
<TR>
<TD vAlign=center align=middle bgColor=#ffffff><IMG src="图片地址"></TD></TR></TBODY></TABLE></CENTER>

9.改变某种颜色
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<center><img src="图片地址"style="FILTER: Chroma(Color=RED)"></center>

10.立体感
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<center><img src="图片地址" style="filter:progid:DXImageTransform.Microsoft.Emboss()"></center>

 11.色彩颠倒
 教程:如何在图片中加入文字? -   * 古艺轩 * - .

复制语法区

<center><img src="图片地址" style="filter:invert"></center>

说明:

1.代码中的<center>是代表图片在页面中的位置,左为left,右为right,可自行调节.
2.红色部分换为自己想要的图片。

 

 

========================

图片+移动文字+背景音乐

 

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

 

代码:<TABLE borderColor=#841a00 cellSpacing=2 cellPadding=1 border=6>
<TBODY>
<TR>
<TD><IMG height=350 src="http://img.blog.163.com/photo/tNACddXFzv2y9ysdxrfetw==/4245205598750634729.jpg" width=500></TD></TR></TBODY></TABLE>

紫色部分为边框的颜色,可以更换你喜欢的边框颜色

蓝色部分为图片的宽度和长度,可以减少或增加数据来调整图片的大小

红色部分为图片地址,可以更换你喜欢的图片地址

 

 

 

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码:

<TABLE borderColor=#b400d8 cellSpacing=2 cellPadding=1 border=6>
<TBODY>
<TR>
<TD><IMG height=250 src="http://img.blog.163.com/photo/tNACddXFzv2y9ysdxrfetw==/4245205598750634729.jpg" width=300></TD></TR></TBODY></TABLE>

 

 

 

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

 

代码:<TABLE borderColor=#90fc00 cellSpacing=2 cellPadding=1 border=6>
<TBODY>
<TR>
<TD><IMG height=350 src="http://img.blog.163.com/photo/tNACddXFzv2y9ysdxrfetw==/4245205598750634729.jpg" width=400></TD></TR></TBODY></TABLE>


图片背景+移动文字+背景音乐

<TABLE height=400 width=400 align=center background=背景图片地址 border=0>
<TBODY>
<TR>
<TD> <DIV align=right twffan="done">
<MARQUEE scrollAmount=1 scrollDelay=100 direction=down behavior=slide width=400 height=300>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=up width=220 height=300><FONT style="FONT-SIZE: 15pt; WIDTH: 50%; COLOR: 文字颜色; LINE-HEIGHT:180%" face=楷体_GB2312><B><P> <BR><BR><BR><BR><BR><BR><BR><BR><BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR>文字<BR> </P></B></FONT></MARQUEE></MARQUEE></DIV></TD></TR></TBODY></TABLE>
<EMBED             style="LEFT: 1px; WIDTH: 0px; TOP: 1px; HEIGHT: 0px" src=歌曲地址 width=1 height=1 type=audio/x-ms-wma loop="TRUE" autostart="TRUE"></embed>

每行文字后面都要加一个<BR>   如果想要歌曲和字同时出来 就在文字最前面多加几个<BR> 具体加多少自己慢慢实验        下面是效果↓

 










屋檐如悬崖风铃如沧海我等燕归来
时间被安排演一场意外你悄然走开
故事在城外浓雾散不开看不清对白
你听不出来风声不存在是我在感慨
梦醒来是谁在窗台
把结局打开
那薄如蝉翼的未来
经不起谁来拆
我送你离开千里之外
你无声黑白
沉默年代或许不该
太遥远的相爱
我送你离开天涯之外
你是否还在
琴声何来生死难猜
用一生去等待
闻泪声入林寻梨花白
只得一行青苔
天在山之外雨落花台
我两鬓斑白
闻泪声入林寻梨花白
只得一行青苔
天在山之外雨落花台
我等你来
一身琉璃白透明着尘埃
你无瑕的爱
你从雨中来诗化了悲哀
我淋湿现在
芙蓉水面采船行影犹在
你却不回来
被岁月覆盖你说的花开
过去成空白
梦醒来是谁在窗台把结局打开
那薄如蝉翼的未来经不起谁来拆
我送你离开千里之外你无声黑白
沉默年代或许不该太遥远的相爱
我送你离开天涯之外你是否还在
琴声何来生死难猜用一生...
我送你离开千里之外你无声黑白
沉默年代或许不该太遥远的相爱
我送你离开天涯之外你是否还在
琴声何来生死难猜用一生去等待

 

                                                  

背景图片上写字贴图具体实例:

1 效果:


如何在图片中加入文字?

如何在图片中加入文字?

如何在图片中加入文字?

如何在图片中加入文字?

代码如下:

<TABLE height=300 cellPadding=10 width=500 align=center background=http://img.blog.163.com/photo/5-Sk0AWOxHV1n8dZKnhjVQ==/433752939112423622.jpg border=3 table="0">
<TBODY>
<TR>
<TD>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#ffff00 size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#ffff00 size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312><FONT size=4><FONT color=#ffffff>如何在图片中加入文字?
</EMBED></FONT></FONT></FONT></DIV></TD></TR></TBODY></TABLE>

兰色是:背景网址(可换)

红色是:放入文字的位置和格式

2  在图中如何加入SWF特效:

如何在图片中加入文字?
如何在图片中加入SWF特效?

 

代码如下:

<TABLE height=300 cellPadding=10 width=500 align=center background=http://bbs.guolan.com/upload/2004813181838.gif border=3 table="0">
<TBODY>
<TR>
<TD>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4></FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4>如何在图片中加入SWF特效?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4></FONT
></DIV>
<DIV align=center><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://imgfree.21cn.com/free/flash/51.swf width=470 height=200 type=application/x-shockwave-flash wmode="transparent" quality="high"></EMBED></DIV></TD></TR></TBODY></TABLE>

绿色:是放入特效的位置和格式

3  效果:


 

双层表框加字 (特效)

天上云欢迎你来到制贴天地学习

 

代码如下:

<TABLE height=300 cellPadding=10 width=500 align=center background=http://bbs.guolan.com/upload/2004813181838.gif border=3 table>
<TBODY>
<TR>
<TD>
<P align=center><FONT face=隶书 color=#f7f709 size=5>双层表框加字<FONT color=#000000> </FONT><FONT color=#c709f7>(特效)</FONT></FONT></P></TD></TR>
<TR>
<TD height=300>
<DIV align=center><FONT face=楷体_GB2312 color=#33ff00 size=4><FONT color=#309d46>落叶无痕</FONT><FONT color=#e6bd1a>欢迎你来到制贴天地学习</
FONT></FONT></DIV>
<DIV align=center><EMBED pluginspage=http://www.macromedia.com/go/getflashplayer src=http://imgfree.21cn.com/free/flash/51.swf width=470 height=200 type=application/x-shockwave-flash quality="high" wmode="transparent"></EMBED></DIV></TD></TR></TBODY></TABLE>

4 如何使用上下滚动字幕?

效果:

  

如何在图片中加入文字?
如何在图片中加入文字?
如何在图片中加入文字?
如何在图片中加入文字?

 

代码如下:

<TABLE height=300 cellPadding=10 width=500 align=center background=http://bbs.guolan.com/upload/2004813181838.gif border=3 table="0">
<TBODY>
<TR>
<TD>
<DIV align=center><FONT face=楷体_GB2312><FONT size=4><FONT color=#ffffff></FONT></FONT></FONT>
<MARQUEE style="WIDTH: 380px; HEIGHT: 84px" scrollAmount=2 direction=up height=84><FONT color=#ff00ff>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#ffff00 size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#ffff00 size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312><FONT size=4><FONT color=#ffffff>如何在图片中加入文字?</FONT></FONT></FONT></DIV></FONT></MARQUEE></DIV></TD></TR></TBODY></TABLE>

==============================

5 文字上下滚动代码:

<MARQUEE style="WIDTH: 380px; HEIGHT: 84px" scrollAmount=2 direction=up height=84><FONT color=#ff00ff>注:scrollAmount=2   是控制字速,数值越大字速就越快!

左右移动字效果:

 


如何在图片中加入文字?
如何在图片中加入文字?
如何在图片中加入文字?
如何在图片中加入文字?

 

代码如下:


<TABLE height=300 cellPadding=10 width=500 align=center background=http://bbs.guolan.com/upload/2004813181838.gif border=3 table="0">
<TBODY>
<TR>
<TD>[*fly]
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#c709f7 size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#1ae66b size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#ffff00 size=4>如何在图片中加入文字?</FONT></DIV>
<DIV align=center><FONT face=楷体_GB2312 color=#ffff00 size=4></FONT><BR></DIV>
<DIV align=center><FONT face=楷体_GB2312><FONT size=4><FONT color=#ffffff>如何在图片中加入文字?</EMBED>[*/fly]</FONT></FONT></FONT></DIV></TD></TR></TBODY></TABLE>

附注:这是方法一,在UBB操作用“飞”就可达到这效果,在使用时把[*/fly]的*号去掉

6  左右移动字方法(二):

效果:

 




左右移动的字!

左右移去的字!

左右移去的字!

谢谢!

 

代码如下:

<TABLE height=300 cellPadding=10 width=500 align=center background=http://bbs.guolan.com/upload/2004813181838.gif border=3 table="0">
<TBODY>
<TR>
<TD></EMBED><BR><BR>
<DIV align=center>
<MARQUEE style="WIDTH: 302px; HEIGHT: 100px" scrollAmount=2 direction=right height=100><FONT color=#ff00ff>
<P align=center><FONT face=隶书 color=#0000ff size=5>左右移动的字!</FONT></P>
<P align=center><FONT face=隶书 color=#ff0000 size=5><B>左右移去的字!</B></FONT></P>
<P align=center><FONT face=隶书 color=#00ffff size=5>左右移去的字!</FONT></P>
<P align=center><FONT face=隶书 color=#ff00ff size=5>谢谢!</FONT></P></FONT></MARQUEE></DIV></TD></TR></TBODY></TABLE>

 

 

背景图片上写字代码

 1

 

玫瑰夫人欢迎您!

玫瑰茶苑欢迎您!

http://q.163.com/rosecenter

 

    你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行!

2  双层背景写字贴图:

效果:

   
 
 
 
玫瑰夫人欢迎您!
这里写字贴图!
 
 教程:如何在图片中加入文字? -   * 古艺轩 * - .
 
 
 
 


 
双层背景贴图写字代码:
 
<P>
<TABLE style="LEFT: 0px; WIDTH: 800px; TOP: 60px" cellSpacing=5 cellPadding=0 align=center background=http://img.blog.163.com/photo/IlGw_deNMRaMRAyKNb7oEA==/881861102034843214.jpg border=0>
<TBODY>
<TR>
<TD>
<CENTER>&nbsp;&nbsp;&nbsp;</CENTER>
<CENTER>
<TABLE style="WIDTH: 734px; BORDER-COLLAPSE: collapse; HEIGHT: 200px" borderColor=#ffffff cellSpacing=5 cellPadding=0 width=734 background=http://img.blog.163.com/photo/C4FHGOoXgE_6VFCBfywz3w==/615304299090094284.jpg border=0>
<TBODY>
<TR>
<TD align=middle>
<DIV>&nbsp;</DIV>
<DIV>&nbsp;</DIV>
<DIV>&nbsp;</DIV>
<DIV>玫瑰夫人欢迎您!</DIV>
<DIV>这里写字贴图!</DIV>
<DIV>
<DIV>&nbsp;</DIV>
<DIV><A href="http://xxyy9090.blog.163.com/"><FONT color=#f0f8ff size=5><IMG style="VISIBILITY: visible" height=349 src="http://img.blog.163.com/photo/qAoUsg5Men1X0LJQ8hhWZg==/2857815438543529417.jpg" width=380></FONT></A></DIV>
<DIV>&nbsp;</DIV>
<DIV>&nbsp;</DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV>
<DIV></DIV></TD></TR></TBODY></TABLE>
<CENTER>&nbsp;</CENTER>
<CENTER>&nbsp;</CENTER></CENTER></TD></ TR></TR></TBODY></TABLE><TD></TD><TD></TD><TR></TR><TR></TR><TBODY><TBODY>
<TABLE>
<TBODY></TBODY></TABLE></P>
<P></P>
<CENTER></CENTER>
<P><TD></TD><TD></TD><TR></TR><TR></TR><TBODY><TBODY>
<TABLE>
<TBODY></TBODY></TABLE><EMBED style="LEFT: 25px; WIDTH: 1px; TOP: 4226px; HEIGHT: 45px" src=http://radio.yangtzeu.edu.cn/recorder/yinyue/12月28蓝色珊瑚.mp3 width=1 height=45 type=audio/x-pn-realaudio-plugin allowScriptAccess="never" allowNetworking="internal" mime -types="mime.types" initfn="load-types" volume="100" autostart="1" loop="-1" controls="ControlPanel"><BR></P>
<DIV></DIV>
<DIV>&nbsp;</DIV>
<DIV>&nbsp;</DIV>
<DIV>&nbsp;</DIV>
<DIV></DIV><TD></TD>
<CENTER></CENTER><TR><TD height="17"></TD><TD>&nbsp;<BR></TD></TR>&nbsp;<BR>
 

 
 

 

3 带框背景写字贴图:

 

你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行 

 

4

 

加入文字 

5

 

加入文字 

 

6

 

 

 

加入文字 

 

7

 

加入文字 

 

8

 

 

加入文字

 

9

 

 你好

 

10

 

 

 

 

11

 

 

 

 

12

 

 

 

 

  代码:

<P style="TEXT-INDENT: 2em">背景图片上写字代码</P>
<P style="TEXT-INDENT: 2em"><A href="http://lusy312.bokee.com/cat.10521902.html"></A>&nbsp;</P>
<P style="TEXT-INDENT: 2em"></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellPadding=100 width=709 align=center background=http://xz1.2000y.net/348114/uploadpic/20051222283368.jpg border=10 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#228b22 cellSpacing=5 borderColorDark=#00ced1 cellPadding=0 width=500 align=center border=1>
<TBODY>
<TR>
<TD>
<P></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em"><FONT color=#ff0000>玫瑰夫人欢迎您!</FONT></P>
<P style="TEXT-INDENT: 2em"><FONT color=#ff0000>玫瑰茶苑欢迎您!</FONT></P>
<P style="TEXT-INDENT: 2em"><A href="http://q.163.com/rosecenter"><FONT color=#ff0000>http://q.163.com/rosecenter</FONT></A></P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">&nbsp;&nbsp;&nbsp; 你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行!</P>
<P style="TEXT-INDENT: 2em">下面是本人所收集的一些图片:</P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellPadding=100 width=480 align=center background=http://xz1.2000y.net/348114/uploadpic/200512222630412.jpg border=10 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#228b22 cellSpacing=5 borderColorDark=#00ced1 cellPadding=0 width=500 align=center border=1>
<TBODY>
<TR>
<TD>
<P></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">加入文字</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">3</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellPadding=100 width=480 align=center background=http://xz1.2000y.net/348114/uploadpic/200512222318215.jpg border=10 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#228b22 cellSpacing=5 borderColorDark=#00ced1 cellPadding=0 width=500 align=center border=1>
<TBODY>
<TR>
<TD>
<P></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行&nbsp;</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">4</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellPadding=100 width=480 align=center background=http://xz1.2000y.net/348114/uploadpic/20041030231251990.jpg border=10 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#228b22 cellSpacing=5 borderColorDark=#00ced1 cellPadding=0 width=500 align=center border=1>
<TBODY>
<TR>
<TD>
<P></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">5</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellPadding=100 width=480 align=center background=http://xz1.2000y.net/348114/uploadpic/20051222211638.jpg border=10 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#228b22 cellSpacing=5 borderColorDark=#00ced1 cellPadding=0 width=500 align=center border=1>
<TBODY>
<TR>
<TD>
<P></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">6</P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellPadding=100 width=480 align=center background=http://xz1.2000y.net/348114/uploadpic/20051222911363.gif border=10 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#228b22 cellSpacing=5 borderColorDark=#00ced1 cellPadding=0 width=500 align=center border=1>
<TBODY>
<TR>
<TD>
<P></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">7</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellPadding=100 width=480 align=center background=http://xz1.2000y.net/348114/uploadpic/200512221313783.jpg border=10 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#228b22 cellSpacing=5 borderColorDark=#00ced1 cellPadding=0 width=500 align=center border=1>
<TBODY>
<TR>
<TD>
<P></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">8</P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellPadding=100 width=480 align=center background=http://xz1.2000y.net/348114/uploadpic/200512221443748.jpg border=10 cellSpacing40>
<TBODY>
<TR>
<TD>
<TABLE borderColor=#228b22 cellSpacing=5 borderColorDark=#00ced1 cellPadding=0 width=500 align=center border=1>
<TBODY>
<TR>
<TD>
<P></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</P></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">9</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=23 width="95%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/uma/siro/xmas04w.gif border=0>
<TBODY>
<TR>
<TD width="100%">
<P></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=8 width="100%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/sizen/yotuba/yotubadai04.jpg border=0>
<TBODY>
<TR>
<TD width="100%">
<P></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=13 width="100%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/tensi/idainaru/rusifa-b03.jpg border=0>
<TBODY>
<TR>
<TD width="100%">&nbsp;
<P></P>
<P style="TEXT-INDENT: 2em"> <FONT color=#ffff00>你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</FONT></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">10</P>
<P style="TEXT-INDENT: 2em"> </P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=23 width="95%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/sizen/yotuba/yotubadai04.jpg border=0>
<TBODY>
<TR>
<TD width="100%">
<P></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=8 width="100%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/uma/siro/xmas04w.gif border=0>
<TBODY>
<TR>
<TD width="100%">
<P></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=13 width="100%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/tensi/idainaru/rusifa-b03.jpg border=0>
<TBODY>
<TR>
<TD width="100%">&nbsp;
<P></P>
<P style="TEXT-INDENT: 2em"><FONT color=#ffff00>你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</FONT></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">11</P>
<P style="TEXT-INDENT: 2em"> </P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=23 width="95%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/ha-to/love14.gif border=0>
<TBODY>
<TR>
<TD width="100%">
<P></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=8 width="100%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/uma/siro/xmas04w.gif border=0>
<TBODY>
<TR>
<TD width="100%">
<P></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=13 width="100%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/sizen/yotuba/yotubab02.jpg border=0>
<TBODY>
<TR>
<TD width="100%"><FONT color=#008000>你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</FONT></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">12</P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=23 width="95%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/pegasus/minipega/n-006.png border=0>
<TBODY>
<TR>
<TD width="100%">
<P></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=8 width="100%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/erement/honoo/F-PEGAl02.gif border=0>
<TBODY>
<TR>
<TD width="100%">
<P></P>
<P style="TEXT-INDENT: 2em">
<TABLE cellSpacing=1 cellPadding=13 width="100%" background=http://www.hm.aitai.ne.jp/~yukarin/ap20037/sozai/sizen/yotuba/yotubab02.jpg border=0>
<TBODY>
<TR>
<TD width="100%"><FONT color=#00ff00>&nbsp; </FONT>
<P></P>
<P style="TEXT-INDENT: 2em"><FONT color=#00ff00>你只要选中你看中的图片,点"复制"(点左键从上往下拉或是从下往上拉,你就会发现有蓝色影块了)然后"粘帖"到你的发表文章之处就行了,美化你的博客就是这么简单!只要两步就行</FONT></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em"></P></TD></TR></TBODY></TABLE></P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">&nbsp;</P>
<P style="TEXT-INDENT: 2em">
<TABLE borderColor=#aecaae cellSpacing=0 cellPadding=0 width="100%" align=center border=0>
<TBODY>
<TR>
<TD style="FONT-SIZE: 36px; COLOR: #008000; FONT-FAMILY: 黑体" vAlign=bottom borderColor=#ffffff align=middle width="100%" height=60>

 

 一些图片特效:

图片的雾化效果

<A _fks_0KDjOpqsZ7exWpQOdRRWig==', 3);return false;" href="http://xxyy9090.blog.163.com/blog/static/45648520068188551454/#">小]

 

上面图片朦胧效果的代码如下:

<TABLE align=center border=0>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity=100,style=3)" width=595 background=图片地址 height=406>
<P align=center><EMBED src=http://imgfree.21cn.com/free/flash/33.swf width=590 height=400 type=application/x-shockwave-flash wmode="transparent" quality="high"></P></TD></TR></TBODY></TABLE>

上面图片朦胧效果的代码如下:

<TABLE align=center border=0>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity=100,style=2)" width=595 background=图片地址 height=406>
<P align=center><EMBED src=http://imgfree.21cn.com/free/flash/33.swf width=590 height=400 type=application/x-shockwave-flash wmode="transparent" quality="high"></P></TD></TR></TBODY></TABLE>

上面图片朦胧效果的代码如下:

<TABLE align=center border=0>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity=100,style=1)" width=595 background=图片地址 height=406>
<P align=center><EMBED src=http://imgfree.21cn.com/free/flash/33.swf width=590 height=400 type=application/x-shockwave-flash wmode="transparent" quality="high"></P></TD></TR></TBODY></TABLE>

请大家注意:style=1或2或3,其图片朦胧的效果就不同,如果是4就没有效果了。在朦胧图片的基础上还能加入透明的FLASH。其代码如下:

<TABLE align=center border=0>
<TBODY>
<TR>
<TD style="FILTER: Alpha(opacity=100,style=3)" width=595 background=图片地址 height=406>
<P align=center><EMBED src=透明FLASH地址 width=590 height=400 type=application/x-shockwave-flash wmode="transparent" quality="high"></P></TD></TR></TBODY></TABLE>

效果如下:

 

下面是朦胧图片加入两个透明FLASH的效果,代码如下:

<TABLE style="FILTER: alpha(opacity=100,style=2); WIDTH: 0px; BORDER-COLLAPSE: collapse; HEIGHT: 0px" borderColor=#555555 cellSpacing=0 cellPadding=0 width=0 align=center background=图片地址 border=0>
<TBODY>
<TR>
<TD><BR><EMBED style="WIDTH: 595px; HEIGHT: 406px" align=right src=透明FLASH地址 width=589 height=400 type=application/x-shockwave-flash quality="high" wmode="transparent"><EMBED style="WIDTH: 589px; HEIGHT: 400px" align=right src=透明FLASH地址 width=650 height=500 type=application/x-shockwave-flash quality="high" wmode="transparent"></TD></TR></TBODY></TABLE>


希望这些代码能对大家的网页美观起到一定的作用。

___________________________________
 

代码为:<IMG src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350>

二.淡化边缘效果

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为:<IMG style=" FILTER: Alpha(opacity=100,style=1)" src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350>

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

代码为:<IMG style="FILTER: Alpha(opacity=100,style=2)" src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350>

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

代码为:<IMG style="FILTER: Alpha(opacity=100,style=3)" src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350>

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

代码为:<IMG style="FILTER: Alpha(opacity=0,finishopacity=100,style=1)" src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350>

三.图片加框效果

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

代码为:1.<img src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350 style="border:8px #987cb9 dotted">

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

代码为:<img src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350 style="border:12px #987cb9 double">

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

代码为:<P align=center><img src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350 style="border:5px #987cb9 dashed">

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

代码为:<img src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350 style="border:12px #987cb9 groove">

 教程:如何在图片中加入文字? -   * 古艺轩 * - .  

代码为  <IMG style=" FILTER: progid:DXImageTransform.Microsoft.Glow(color=#cc8888,strength=10)" src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg">

 教程:如何在图片中加入文字? -   * 古艺轩 * - . 

四.图片移动效果

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为<MARQUEE scrollAmount=10 direction=right><IMG src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg"></MARQUEE>

说明:direction=right表示图片自左向右移动,direction=left表示自右向左移动,也可缺省.direction=up表示图片自下而上移动,direction=down表示自上往下移动.

 

代码为:<marquee width=100% behavior=alternate scrollamount=10><img

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

src=http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg width=350 ></marquee>

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

marquee width=100% behavior=slide scrollamount=10><img src=http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpgwidth=350 ></marquee>

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为::<marquee direction=left><marquee behavior=alternate direction=up height=500><img src=http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg> </marquee>

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为:<marquee width=350 ><img src=http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg width=350>  </marquee><marquee direction=right width=350 ><img src=http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg width=350>  </marquee>

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为:<marquee direction=up  scrollamount=3><center><img src=http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg width=350></marquee><marquee direction=down scrollamount=3> <center> <div style="width:350;filter:flipv;"><img src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=350></div></center></marquee>

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为:
<MARQUEE scrollAmount=3 direction=right behavior=alternate>
<MARQUEE direction=up behavior=alternate width=100 height=500>
<P align=center><IMG src="

http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg"></MARQUEE>

 教程:如何在图片中加入文字? -   * 古艺轩 * - .  教程:如何在图片中加入文字? -   * 古艺轩 * - .  教程:如何在图片中加入文字? -   * 古艺轩 * - .  教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为:<TABLE cellSpacing=0 cellPadding=0 width="50%" align=center border=0>
<TBODY>
<TR>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=175><IMG style="FILTER: fliph()" src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=175></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=175><IMG src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=175></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 direction=right width=175><IMG style="FILTER: fliph()" src="

http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=175></MARQUEE></TD>
<TD align=middle>
<MARQUEE scrollAmount=1 scrollDelay=100 width=175><IMG src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg" width=175></MARQUEE></TD></TR></TBODY></TABLE>

五.图片的一些效果的组合

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为:

1.<MARQUEE direction=right  scrollamount=10><IMG style="FILTER: Alpha(opacity=100,style=2)" src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg"> </MARQUEE>

  2.<MARQUEE direction=right  scrollamount=10 >
<TABLE style="FILTER: Alpha(opacity=100,style=2)"  width=350 height=263 background=http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg > </MARQUEE>

 教程:如何在图片中加入文字? -   * 古艺轩 * - .

代码为:

 <MARQUEE style="WIDTH: 1000px " scrollAmount=5 direction=right>
 <img src="http://img.blog.163.com/photo/C_DZm739ryYp3JNCsvJF4w==/1162491653815131852.jpg"  width=350  style="border:8px #987cb9 dotted"></MARQUEE>

 

 
 
 
图画视听》欢迎您!点击图片进入!
 
  评论这张
 
阅读(68645)| 评论(3)

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018