手把手指导 宝宝主页信纸制作全攻略

13/06/27 14:59:06 标签:

     很多妈妈表示不明白主页信纸要怎么制作,看到那么多代码觉得很难。其实信纸制作非常简单,下面羊羊手把手来指导您如何制作好看的信纸。

第一步:制作背景图

      信纸的背景图由三个部分:头图部分+文字背景部分+尾部图片部分。图片高度不限,宽度必须是550

      您可以找一张或者多张你喜欢的图片,将图片用软件(PS、美图秀秀等)分成3部分,在头部图片或者尾部图片上加上“www.ci123.com”的水印。(注:文字背景最好用纯色或简单连贯的图片,因为文字背景图片会跟着文章字数的增加不断叠加拉长)

示范:(羊羊准备的3张图片)

1、头图部分

2、文字背景部分(因为这张示范图为纯色,所以只要一小段就可以了)

3、尾部图片部分(我在图片尾部加了育儿网的水印哦!)

第二步:图片上传获取图片地址

      将您之前准备好的图片上传到宝宝主页或者是博客的相册中(如果是动图的话,最好上传到博客相册中),在从相册中找到该图片,右击>>属性>>复制URL地址

按照这样的形式,我们现在就获得了三个图片的地址。

头图部分地址:http://static.ci123.com/uploadfiles/130627/1633573bEEthhLL3nnS00u.gif

文字背景部分地址:http://good.ci123.com/2010/upload/pics/2013061817384858.jpg

尾部图片地址:http://static.ci123.com/uploadfiles/130627/16433941g76ppdk8C5VIx0.gif

第三步:了解信纸代码

       信纸代码是制作信纸最重要的一个步骤,其实只要将下面的代码复制到编辑器的“源代码”框中,替换掉头图部分、文字背景部分、尾部图片的链接即可。

信纸代码:

<table border="0" cellspacing="0" cellpadding="0" width="550">

<tbody>

<tr>

<td bgcolor="#FFFFFF"><img src="信纸开头图片地址" alt="" /></td>

</tr>

<tr>

<td background="文字背景图片地址" bgcolor="#b1e3fa">

<p>&nbsp;</p>

<p>文字写在这里</p>

<p>&nbsp;</p>

</td>

</tr>

<tr>

<td bgcolor="#FFFFFF"><img src="信纸尾部图片地址" alt=""  /></td>

</tr>

</tbody>

</table>

第四步:如何替换代码

1、打开源代码框

2、将信纸代码复制进去,将之前对应的图片链接替换进去。

3、更新后的效果图

效果如下:

 

文字写在这里

 

4、添加文字后测试效果

5、文章发布后的效果

相信聪明的麻麻们应该都学会了吧!赶快去动手制作你喜欢的信纸吧!

更多信纸教程

简单实用的用代码做信纸教程

石头妈妈的制作信纸教程

点击马上前往0bf2aefa850cc81ddb9a524858b6b1df.gif宝宝主页第四届信纸大赛

该日记已被主页管理员miss羊推荐到精彩日记,奖励30分

阅读(2304) | 留言(22) | 上一篇 | 下一篇 | 

留言板

  • 毛紫涵对羊羊说:2014-06-07 17:19:37
  • 好漂亮
  • 溶情蜜域360QQ对羊羊说:2014-01-24 20:46:39
  • 哈漂亮!有时间再琢磨。
  • 妙嘟嘟对羊羊说:2013-07-11 18:27:57
  • 是啊,暂时没时间搞这个,有点麻烦!
  • sunnie514对羊羊说:2013-07-11 15:17:39
  • 看起来麻烦啊!哪天有时间试试。
  • 浅浅宝贝对羊羊说:2013-07-09 22:16:20
  • 有时间要研究研究,呵呵
  • judy_juzi对羊羊说:2013-07-09 13:25:20
  • 介绍的很仔细啊,等有空了,好好琢磨琢磨!
  • ihqgfqt对羊羊说:2013-07-07 22:31:25
  • 没弄明白,太晚了只好睡觉放弃了
  • 乖妞宝对羊羊说:2013-07-07 12:10:22
  • 为什么按照宝妈的步骤来做更新后不出来图图呢??
  • 沁入心脾对羊羊说:2013-07-07 10:20:21
  • 我来看看
  • 期待逆袭对羊羊说:2013-07-06 10:57:44
  • 看不懂,太麻烦了。还是放弃参加算了。

我要留言 诈骗信息提醒

请下载最新的flashplayer!