静远草堂

静心度沧桑远足浪天际草芥凡夫子堂正立尘埃

日志

关于我

静远草堂

文章分类

LOFTER精选

八招诀窍，教你实力撩妹 >

网易考拉推荐

如何在图片上写字

2011-01-03 13:40:29| 分类：网页制作 | 标签： |举报 |字号大中小订阅

下载LOFTER 我的照片书 |

如何用图片做底板在图片上写日记现在向朋友们介绍一下：
1.复制这段代码：

<table width="650" border="0"><tr><td height="500" background=这里加入图片地址></td></tr></table>

进入写日记页面，点击右上角的《全部功能》——>点击这个<>符号——>粘贴复制好的代码——>回到开始的写日记页面就可以在图片上面写日记了。
2.代码中的 width="650"是图片的宽、height="500"是图片的高。可以根据自己需要进行调整。
3.日记字体的大小和颜色可以用日记编辑栏的工具进行调整。

4.图片够宽大，可以使用的代码：

</Table></tr></td><Table width=100％ background="图片网址"><tr><td>

图片作背景写上你的文字

通过代码，将你喜欢的任意一副图片作文字的背景，然后在上面写上你的文字，从而起到美化和装饰作用。

如下图：

代码是：

<TBODY>

<TD>

具体做法：

1、打开“写日志”，点右上角“全部功能”。然后点开下面那个小三角括弧，进入代码状态：

2、把上面的代码复制到下面的空白处,如下图：

3、把你希望当作背景图片的网址复制，替换代码里面的这个图片网址（注意，图片应该是 jpg 格式）：

4、代码里面的那个数字800表示背景的宽度。如果你的图片不是很大，你可以把它设置小一点，比如650、600、500等，都是可以的。

5、完成以上步骤后，点击“保存为草稿”，你就会看到你添加的背景效果了。然后重新点开“编辑”，你就可以在你的背景图片上写字了。

若想省事，你也可以把上面这几幅已经做好的背景复制到你的博客里，直接在上面写你的文字就可以了。是不是很简单哟。呵呵。愿朋友们开心。

另：在网上看见一副漂亮的图片，怎样获得它的网址呢？方法是：鼠标点在图片上，点右键，选属性，就可以看见：地址（URL），后面的那一串就是图片的网址了。

滚动字幕

演示效果：

欢迎光临博啦的博客，博啦为您准备了大量的博客素材、电脑知识，哲理文章，养生保健，百万书库，幽默笑料，为人处世，生活常识，五花八门的有用的东西。如果您在游览本博时有什么问题和看法，尽管提出宝贵意见！谢谢您的光临！

代码提示：将下面的代码复制到〈〉中

<MARQUEE style="FILTER: glow(color=#000000)" scrollAmount=1 direction=up width=500 height=190><FONT style="FONT-SIZE: 16pt; COLOR: #ffcc99; FONT-FAMILY: #字体=隶书">
<DIV align=right>欢迎光临博啦的博客，博啦为您准备了大量的博客素材、电脑知识，哲理文章，养生保健，百万书库，幽默笑料，为人处世，生活常识，五花八门的有用的东西。如果您在游览本博时有什么问题和看法，尽管提出宝贵意见！谢谢您的光临！<BR></DIV></FONT></MARQUEE>

宠辱不惊，看门前花开花落；
去留无意，望天上云卷云舒。
欢迎光临博啦的博客

代码提示：将下面的代码复制到〈〉中

<MARQUEE style="FILTER: glow(color=#000000)" scrollAmount=1 direction=up width=500 height=190><FONT style="FONT-SIZE: 16pt; COLOR: #ffcc99; FONT-FAMILY: #字体=隶书">
<DIV align=right>宠辱不惊，看门前花开花落；<BR>去留无意，望天上云卷云舒。<BR>欢迎光临博啦的博客<BR></DIV></FONT></MARQUEE>

多读书胸中自负
勤学习万事皆通
欢迎光临博啦书屋

代码提示：将下面的代码复制到〈源代码〉中

<MARQUEE style="FILTER: glow(color=#000000)" scrollAmount=1 direction=up width=500 height=190><FONT style="FONT-SIZE: 16pt; COLOR: #ffcc99; FONT-FAMILY: #字体=隶书">
<DIV align=right>多读书胸中自负<BR>勤学习万事皆通<BR>欢迎光临博啦书屋<BR></DIV></FONT></MARQUEE>

关注健康! 关爱生命!
把一生的幸福送给您
欢迎光临博啦的博客

代码提示：将下面的代码复制到〈源代码〉中

<MARQUEE style="FILTER: glow(color=#000000)" scrollAmount=1 direction=up width=500 height=190><FONT style="FONT-SIZE: 16pt; COLOR: #ffcc99; FONT-FAMILY: #字体=隶书">
<DIV align=right>关注健康! 关爱生命!<BR>把一生的幸福送给您<BR>欢迎光临博啦的博客<BR></DIV></FONT></MARQUEE>

代码提示：将下面的代码复制到〈源代码〉中

<MARQUEE style="FILTER: glow(color=#000000)" scrollAmount=1 direction=up width=500 height=190><FONT style="FONT-SIZE: 16pt; COLOR: #ffcc99; FONT-FAMILY: #字体=隶书">
<DIV align=right>当一个人生活枯燥的时候<BR>别忘了用心体会是一种习惯<BR>当一个人人生乏味的时候<BR>别忘了培养幽默是一种习惯<BR>欢迎光临——博啦的博客！<BR></DIV></FONT></MARQUEE>

演示效果：

当一个人生活枯燥的时候
别忘了用心体会是一种习惯
当一个人人生乏味的时候
别忘了培养幽默是一种习惯
欢迎光临——博啦的博客！

漂亮字体及代码:

1、彩色字体色彩绚丽

彩色字体色彩绚丽

2、围边字体

围边字体体字边围

3、投影字体

投影字体投影字体

4、抛射字体

抛射字体

5、向下移动的文字

向下移动的文

向上移动的文字

字

6、向左\右移动的文字

向左移动的文字

向右移动的文字

7、由中间向两边移动的文字和图像

由中间向两边移动的文字和图像

由中间向两边移动的文字和图像制作移动的漂亮字及代码 - 博啦 - 博啦的博客

8、来回走动的文字

来回走动的文字

9、波浪式的文字

vior=altrnate width=590 src="">
波浪式的文字

10、左右运动的文字

左右运动的文字

左右运动的文字

11、其实倒影字就这么简单！

其实倒影字就这么简单！
其实倒影字就这么简单！

12、原地跳动的文字

原地跳动文字

13、交替跳跃的文字

交替跳跃文字

14、模糊的背景字

模糊背景字15、穿梭的文字穿　穿制作移动的漂亮字及代码 - 博啦 - 博啦的博客梭梭文文字字 16、彩虹文字

彩虹字体

17、左向右上下起伏飞翔， height=200 是上下起伏飞翔幅度，可以调整，区分图片大小，一般设置在50至150的范围内比较好

!去回快
制作移动的漂亮字及代码 - 博啦 - 博啦的博客

18、右向左上下起伏飞翔，height=100 是上下起伏飞翔幅度，可以调整，区分图片大小，一般设置在50至150的范围内比较好

制作移动的漂亮字及代码 - 博啦 - 博啦的博客我在追“心”

代码：

1、彩色字体色彩绚丽

</font><br>

<P align=center><STRONG><FONT size=6><FONT face=华文新魏><FONT color=#ff0000>彩

</FONT><FONT color=#ff8900>色</FONT><FONT color=#92c000>字</FONT><FONT color=#00c024>体</FONT><FONT color=#00c0da>色</FONT><FONT color=#0053ff>彩</FONT><FONT color=#4800ff> 绚</FONT><FONT color=#ff00ff>丽</FONT></FONT></FONT></STRONG></P>

2、阴影字体

</font><br><P align=center><FONT style="FONT-SIZE: 30pt; FILTER: shadow(color=333366

); WIDTH: 631px; COLOR: #3333ff; LINE-HEIGHT: 150%; FONT-FAMILY: 华文新宋; HEIGHT: 51px"></P>

3、围边字体

</font><br><P align=center> </P><FONT style="FONT-SIZE: 30pt; FILTER: glow(color=gray,strength=5); WIDTH: 100%; COLOR: red; LINE-HEIGHT: 150%; FONT-FAMILY: 华文行楷">

<P align=center><B>围边字体体字边围</B></P></FONT>

4、投影字体

</font><br><P align=center> </P>

<P align=center><FONT style="FONT-WEIGHT: bolder; FONT-SIZE: 40px; FILTER: blur(add=1, direction=45,strength=10); WIDTH: 450px; " color=#000099>投影字体投影字体</FONT></CAPTION> <BR></CAPTION></P>

5、抛射字体

<DIV style="FILTER: shadow(color=#FF9999

, strength=60); WIDTH: 480px; HEIGHT: 121px"><FONT face=华文彩云 color=#ff0000 size=7><B>

6、带背景的闪光字体（背景图片可以换）

<TBODY>

<TR>

<TBODY>

<TR>

<TD align=middle><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 40pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=楷体_gb2312 color=#336699><B>带背景的闪光字体（背景图片可以换）</B></FONT></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>

7、向上移动的文字

</font><br><P align=center>

<TBODY>

<TR>

<P align=center><FONT face=隶书 color=#ff0000 size=7><B>向上移动的文字</B></FONT></P></MARQUEE></DIV></TD></TR></TBODY></TABLE></P>

8、向下移动的文字

<TBODY>

<TR>

<P align=center><FONT face=隶书 color=#ff0000 size=7><B>向下移动的文字</B></FONT></P></MARQUEE></DIV></TD></TR></TBODY></TABLE></P>

9、向左移动的文字

<TBODY>

<TR>

<P align=center><FONT face=隶书 color=#ff0000 size=5><B>向左移动的文字</B></FONT></P></MARQUEE></DIV></TD></TR></TBODY></TABLE></P>

10、向右移动的文字

<P align=center><FONT face=隶书 color=#ff0000 size=7><B>向右移动的文字</B></FONT></P></MARQUEE></P>

11、由中间向两边移动的文字和图像

<MARQUEE width=200 height=50><IMG onmousewheel="return bbimg(this)" style="CURSOR: pointer" src="" >由中间向两边移动的文字和图像 </FONT></MARQUEE><FONT face=华文彩云 color=#ee110e size=5><FONT face=华文彩云 color=#ee1111 size=5>

<MARQUEE direction=right width=200 height=50>由中间向两边移动的文字和图像<IMG onmousewheel="return bbimg(this)" style="CURSOR: pointer" src="" ></FONT></MARQUEE></FONT></FONT></P></FONT>

12、来回走动的文字

</font><br>

<TBODY>

<TR>

<P align=center><FONT face=隶书 color=#ff0000 size=6><B>来回走动的文字</B></FONT></P></MARQUEE></DIV></TD></TR></TBODY></TABLE></P>

13、波浪式的文字

</font><br><P align=center> </P>

<DIV align=center><FONT face=隶书 color=red size=7>波浪式的文字</FONT></DIV></MARQUEE></DIV></MARQUE></MARQUEE>

14、左右运动的文字

</font><br><DIV align=center>

<DIV align=center> <FONT face=隶书 color=#ff0000 size=7>左右运动的文字</FONT></DIV></MARQUEE></DIV>

<DIV align=center><FONT face=隶书 color=#ff0000 size=7>左右运动的文字</FONT></DIV></MARQUEE></DIV>

15、其实倒影字就这么简单！

</font><br><P align=center><FONT style="FONT-SIZE: 30pt; WIDTH: 100%; COLOR: blue; LINE-HEIGHT: 150%; FONT-FAMILY: 华文新魏"><B><EM>其实倒影字就这么简单！</EM></B></FONT><FONT style="FONT-SIZE: 30pt; FILTER: FlipV; WIDTH: 100%; COLOR: blue; LINE-HEIGHT: 150%; FONT-FAMILY: 华文新魏"><B><EM>其实倒影字就这么简单！</EM></B></FONT></P>

16、原地跳动的文字

17、交替跳跃的文字

18、模糊的背景字

19、穿梭的文字

20、彩虹文字

<TBODY>

<TR>

<TBODY>

<TR>

21、中间向上下移动语法：

22、左向右上下起伏飞翔， height=200 是上下起伏飞翔幅度，可以调整，区分图片大小，一般设置在50至150的范围内比较好

23、右向左上下起伏飞翔，height=100 是上下起伏飞翔幅度，可以调整，区分图片大小，一般设置在50至150的范围内比较好

祝大家永远幸福

代码：

博啦欢迎您

代码：

<DIV style="FILTER: shadow(color=#c299ff, strength=8); WIDTH: 490px"><FONT style="FONT-WEIGHT: normal; FONT-SIZE: 40pt; LINE-HEIGHT: normal; FONT-STYLE: normal; FONT-VARIANT: normal" face=华文彩云 color=#fff000>博啦欢迎您</FONT> <BR></DIV></DIV>

代码：

淡淡的问候最醇

代码：

<FONT style="FONT-SIZE: 40pt; FILTER: shadow(color=red); WIDTH: 100%; COLOR: green; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>淡淡的问候最醇</B></FONT><BR></DIV>

博啦欢迎你

代码：

<TBODY>

<TR>

朋友您好！

亲自动手！

体验成功！

代码：

<TBODY>

<TR>

<TD>

向下:down 向左:alternate 向右:right

竖排字渐出：

vior=slide loop=1 width=550 height=293>

我带着远古的心愿

你怀揣前世的祈盼

我饱含如许的虔诚

你浸润最深的期待

我们跨越万水千山

赴今世的约定...

你感觉我深情凝眸的甜柔

我倾听你心室澎湃的跳动

白云轻盈飘荡

星月神秘闪烁

燃烧的篝火旁

我们席地而坐

倾诉不尽的相思

燃烧的火焰是不灭的炙热

让我们一起出发

背上快乐的行囊

携着一路的欢唱

踏着灿烂的芬芳

望--天上云卷霞飞

看--地下小桥流水

拥--郁郁山川入怀

枕--簇簇波浪入眠

把--忧烦抛在身后

让--愉悦洒满诗行

代码：

<P align=left><FONT style="FONT-SIZE: 18pt; FILTER: WIDTH: 100%; COLOR: #ea0000; LINE-HEIGHT: 130%; FONT-FAMILY: 方正姚体" color=#ff0000>我带着远古的心愿<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></FONT></P></MARQUEE></MARQUEE></DIV>

一个不错的CSS模拟的按钮效果

GoogleBaiduSinaSohuCSDNsql163

一个不错的CSS模拟的按钮效果的代码：

<!--

.btnOFF{padding:3px;border:1px outset;cursor:pointer;background-color: green;width:100px;height:16px;text-align:center;}

.btnON{padding:3px;border:1px inset;background-color: #CCCC33;width:100px;height:16px;text-align:center;color:red;}

-->

</style>

<!--

function setEffect(link_id)

{

var i;

for(i=0;i<link.length;i++)

{

if(i != link_id)

{

link[i].className = "btnOFF";

}

else

{

link[i].className = "btnON";

}

//-->

</script>

<p align=center><span id="link" class="btnOFF" onclick="setEffect(0)">Google</span><span id="link" class="btnOFF" onclick="setEffect(1)">Baidu</span><span id="link" class="btnOFF" onclick="setEffect(2)">Sina</span><span id="link" class="btnOFF" onclick="setEffect(3)">Sohu</span><span id="link" class="btnOFF" onclick="setEffect(4)">CSDN</span><span id="link" class="btnOFF" onclick="setEffect(5)">sql163</span></p>

评论这张

转发至微博

阅读(1515)| 评论(0)

喜欢推荐转载

历史上的今天

在LOFTER的更多文章

this.p={  m:2,
              b:2,
              loftPermalink:'',
              id:'fks_094064083085086069086086095095093082087075080094082071',
              blogTitle:'如何在图片上写字',
              blogAbstract:'  <P\> <BR\></P\>  <TABLE border=\"0\"  width=\"650\"  \>  <TBODY\>  <TR\>  <TD height=\"800\"  background=\"http://img.blog.163.com/photo/-v_Psvo97P9r783KRAs_cw==/5120029826367315887.jpg\"  \>  <P\><FONT color=\"#ff0000\"  size=\"4\"  \><STRONG\>如何用图片做底板在图片上写日记现在向朋友们介绍一下：<BR\>1.复制这段代码：</STRONG\></FONT\></P\>  <P\><FONT color=\"#ff0000\"  size=\"4\"  \><STRONG\><table width=\"650\" border=\"0\"><tr><td height=\"500\" background=这里加入图片地址></td></tr></table></STRONG\></FONT\></P\>  <P\><FONT color=\"#ff0000\"  size=\"4\"  \><STRONG\>进入写日记页面，点击右上角的《全部功能》——>点击这个<>符号——>粘贴复制好的代码——>回到开始的写日记页面就可以在图片上面写日记了。<BR\>2.代码中的 width=\"650\"是图片的宽、height=\"500\"是图片的高。可以根据自己需要进行调整。<BR\>3.日记字体的大小和颜色可以用日记编辑栏的工具进行调整。</STRONG\></FONT\></P\>  <P\><FONT color=\"#ff0000\"  size=\"4\"  \><STRONG\>4.图片够宽大，可以使用的代码：</STRONG\></FONT\></P\>  <P\></P\></TD\></TR\></TABLE\>',
              blogTag:'',
              blogUrl:'blog/static/9468484420110310424486',
              isPublished:1,
              istop:false,
              type:2,
              modifyTime:1317277883721,
              publishTime:1294033229024,
              permalink:'blog/static/9468484420110310424486',
              commentCount:0,
              mainCommentCount:0,
              recommendCount:0,
              bsrk:-100,
              publisherId:0,
              recomBlogHome:false,
              currentRecomBlog:false,
              attachmentsFileIds:[],
              vote:{},
              groupInfo:{},
              friendstatus:'none',
              followstatus:'unFollow',
              pubSucc:'',
              visitorProvince:'',
              visitorCity:'',
              visitorNewUser:false,
              postAddInfo:{},
              mset:'000',
              mcon:'',
              srk:-100,
              remindgoodnightblog:false,
              isBlackVisitor:false,
              isShowYodaoAd:true,
              hostIntro:'',
              hmcon:'1',
              selfRecomBlogCount:'0',
              lofter_single:'<a hidefocus="true" target="_blank" href="http://inpin.blog.163.com/blog/static/2633040402016620112520219/"><img onload="var nimg = new Image(); nimg.src=\'http://blog.163.com/newpage/images/analyse.png?lofter_single&t=\'+new Date().getTime()" border="0" src="http://imglf.nosdn.127.net/img/TlZCWHdFWFpidkQ1dGtJK1N5cFRBNzBLUFFPYnJEVi9LWk1KTzJlMTU2Yz0.jpg"/></a>'
            }

{list a as x}
    {if !!x}
    <div class="iblock nbw-fce nbw-f40">
      <a class="fc03 noul" target="_blank" hidefocus="true" href="http://blog.163.com/${x.visitorName}/">
      {if x.visitorName==visitor.userName}
      <img alt="${x.visitorNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.visitorName)}&r=${visitor.imageUpdateTime}"/>
      {else}
      <img alt="${x.visitorNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.visitorName)}"/>
      {/if}
      </a>
      <div class="cwd vname thide">
        {if x.moveFrom=='wap'}
          <a class="noul pnt" target="_blank" href="http://blog.163.com/services/wapblog.html?frompersonalbloghome"><span title="来自网易手机博客" class="iblock wapIcon"> </span></a>
        {elseif x.moveFrom=='iphone'}
          <a class="noul pnt" target="_blank"><span title="来自iPhone客户端" class="iblock iphoneIcon"> </span></a>
        {elseif x.moveFrom=='android'}
          <a class="noul pnt" target="_blank"><span title="来自Android客户端" class="iblock androidIcon"> </span></a>
        {elseif x.moveFrom=='mobile'}
          <a class="noul pnt" target="_blank" href="http://blog.163.com/services/emsblog.html?frompersonalbloghome"><span title="来自网易短信写博" class="iblock wapIcon"> </span></a>
        {/if}
        <a class="fc03 m2a"  target="_blank" hidefocus="true" href="http://blog.163.com/${x.visitorName}/">
          ${fn(x.visitorNickname,8)|escape}
        </a>
      </div>
    </div>
    {/if}
    {/list}

<#--最新日志，群博日志--> <#--推荐日志-->

<p class="fc06">推荐过这篇日志的人：</p>
    <div>
      {list a as x}
      {if !!x}
      <div class="iblock nbw-fce nbw-f40">
        <a class="fc03 noul" target="_blank" hidefocus="true" href="http://blog.163.com/${x.recommenderName}/">
        <img alt="${x.recommenderNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.recommenderName)}"/>
        </a>
        <div class="cwd thide">
          <a class="fc03 m2a" target="_blank" hidefocus="true" href="http://blog.163.com/${x.recommenderName}/">
            ${fn(x.recommenderNickname,6)|escape}
          </a>
        </div>
      </div>
      {/if}
      {/list}
    </div>
    {if !!b&&b.length>0}
    <p  class="fc06">他们还推荐了：</p>
    <ul>
    {list b as y}
      {if !!y}
        <li class="rrb"><span class="iblock">·</span><a class="fc03 m2a" target="_blank" href="http://blog.163.com/${y.recommendBlogPermalink}/?from=blog/static/9468484420110310424486">${y.recommendBlogTitle|escape}</a></li>
      {/if}
    {/list}
    </ul>
    {/if}

<#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇，下一篇--> <#-- 热度 -->

{list a as x}
    {if !!x}
    <div class="hotItem iblock nbw-fce nbw-f40">
      <a class="fc03 noul" target="_blank" hidefocus="true" href="http://blog.163.com/${x.publisherUsername}/">
      {if x.publisherUsername==visitor.userName}
      <img alt="${x.publisherNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.publisherUsername)}&r=${visitor.imageUpdateTime}"/>
      {else}
      <img alt="${x.publisherNickname|escape}" onerror="this.src=location.f40" class="cwd bdwa bdc0" src="${fn1(x.publisherUsername)}"/>
      {/if}
      </a>
      <div class="cwd vname thide">
        <a class="fc03 m2a"  target="_blank" hidefocus="true" href="http://blog.163.com/${x.publisherUsername}/">
          ${fn(x.publisherNickname,8)|escape}
        </a>
      </div>
      <a class="f-myLikeIcons hottype {if x.type==1} js-liketype{elseif x.type==2} js-reblogtype{elseif x.type==3} js-sharetype{else}{/if}" target="_blank" hidefocus="true" href="http://blog.163.com/${x.publisherUsername}/"> </a>
    </div>
    {/if}
    {/list}

<#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->

页脚

我的照片书 - 博客风格 - 手机博客 - 下载LOFTER APP - 订阅此博客

静远草堂

导航

日志

如何在图片上写字

历史上的今天

最近读者

热度

在LOFTER的更多文章

评论

页脚