贡献几个用图片做背景的全屏模板

来源: SnowFallingOnWater 2015-02-24 19:29:01 [] [博客] [旧帖] [给我悄悄话] 本文已被阅读: 次 (13206 bytes)
本文内容已被 [ SnowFallingOnWater ] 在 2015-03-19 15:27:17 编辑过。如有问题,请报告版主或论坛管理删除.
这个模版是在论坛里发贴时,用你喜欢的图作背景
 
1. 按照平时写贴一样,写好后先不要发,在菜单选择里有:HTML源代码。点了之后你会看到你刚刚写的文章的HTML码,然后在最顶端加入这段:
<style type="text/css"> table{ background-color:transparent; margin-left: 0px !important; } td { background-color:transparent; } body { background-image:url("http://i60.tinypic.com/25pr39i.jpg") !important; background-attachment:fixed; background-repeat:repeat; background-position:center; font-size_replace:16; color:black !important; } A:link { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:hover { &#160;&#160;&#160;&#160;&#160;&#160; COLOR:#2a544b; BACKGROUND-COLOR: #ffffcc; TEXT-DECORATION: underline } A:visited { &#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:active { &#160;&#160;&#160;&#160;&#160;&#160; TEXT-DECORATION: none } #postbody { &#160;&#160; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 970px! important; PADDING-TOP: 0px } #postbodyTABLE { &#160;&#160;&#160;&#160;&#160;&#160;&#160; MARGIN-LEFT: 0px! important } .bookmark { &#160;&#160;&#160;&#160;&#160; PADDING-RIGHT: 8px; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 8px; OVERFLOW: hidden; WIDTH: 970px; PADDING-TOP: 8px; BORDER-BOTTOM: #666 0px solid } </style> <br />
<br />
<table width="1000" height="1300" cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr>
<td align="center">
 
2. 然后在最末尾加这段
</td>
</tr>
</tbody>
</table>
 
3. voilà, 发帖。图案就会变成你的贴的背景
4. 你如果有其他喜欢的图片做背景,也可以在这里把你的图片连接换在那两个引号里
background-image:url("")
 
几点补充:
如果你使用自己的图片,有如下的建议:?
1)  尺寸:建议 1600x1600 pixel size. 我用这个尺寸的图案做背景效果最好,在电脑里,手机,tablet看都正常
2)如果你的图没有那么大,建议的最小尺寸是:1280x1084。小尺寸的图的缺陷是:背景是两个同样的图连在一起的。所以选图时要记得:选用边缘的图案比较类似,比如例子里的图,都是差不多的颜色和质地,别人不会感觉到是两个图连在一起的。
3)图片的选择:尽量选颜色比较均匀,背景图案不要太花俏。因为背景是衬托你写的东西,不能喧宾夺主。如果你喜欢淡颜色的背景,就尽量选择白,淡黄,淡绿,淡粉,淡蓝一类的图。
4)如果你喜欢深色的背景也没问题,只要是图案均匀的,原理是一样的。不过用深色背景,记得把字换成白色,一便于人家读。我把字改成白色的码也放在下面例子2里
5)如果你想用大头像做背景,建议把头像弄的很淡很淡,就象小七宝的那个帖那样,效果非常的棒。还有就是人像做背景,最好用1600x1600 pixel size。这样即使别人上下看帖时,人像会一直在背景里。人像的位置放在verticle 2/3的地方效果最好。
6)图片的制作,基本上,用Windows 自带的 Paint 就可以做图。这个话题太大,这里会做图的高手多,就不在这里讲了。
 
贡献几个我用过的背景,喜欢的可以直接拿去用:

特别鸣谢小七宝的好建议,做了screenprint的几张图,这样比较容易看到效果,非常感谢!
 
(1)一片淡绿色叶子的白色背景
<style type="text/css"> table{ background-color:transparent; margin-left: 0px !important; } td { background-color:transparent; } body { background-image:url("http://i60.tinypic.com/25pr39i.jpg") !important; background-attachment:fixed; background-repeat:repeat; background-position:center; font-size_replace:16; color:black !important; } A:link { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:hover { &#160;&#160;&#160;&#160;&#160;&#160; COLOR:#2a544b; BACKGROUND-COLOR: #ffffcc; TEXT-DECORATION: underline } A:visited { &#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:active { &#160;&#160;&#160;&#160;&#160;&#160; TEXT-DECORATION: none } #postbody { &#160;&#160; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 970px! important; PADDING-TOP: 0px } #postbodyTABLE { &#160;&#160;&#160;&#160;&#160;&#160;&#160; MARGIN-LEFT: 0px! important } .bookmark { &#160;&#160;&#160;&#160;&#160; PADDING-RIGHT: 8px; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 8px; OVERFLOW: hidden; WIDTH: 970px; PADDING-TOP: 8px; BORDER-BOTTOM: #666 0px solid } </style> <br />
<br />
<table width="1000" height="1300" cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr>
<td align="center">

编辑时是这样的:



效果图

 
 
(2)星星点点的黑色夜空背景
<style type="text/css"> table{ background-color:transparent; margin-left: 0px !important; } td { background-color:transparent; } body { background-image:url("http://i60.tinypic.com/t5gi13.jpg") !important; background-attachment:fixed; background-repeat:repeat; background-position:center; font-size_replace:16; color:white !important; } A:link { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:hover { &#160;&#160;&#160;&#160;&#160;&#160; COLOR:#2a544b; BACKGROUND-COLOR: #ffffcc; TEXT-DECORATION: underline } A:visited { &#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:active { &#160;&#160;&#160;&#160;&#160;&#160; TEXT-DECORATION: none } #postbody { &#160;&#160; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 970px! important; PADDING-TOP: 0px } #postbodyTABLE { &#160;&#160;&#160;&#160;&#160;&#160;&#160; MARGIN-LEFT: 0px! important } .bookmark { &#160;&#160;&#160;&#160;&#160; PADDING-RIGHT: 8px; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 8px; OVERFLOW: hidden; WIDTH: 970px; PADDING-TOP: 8px; BORDER-BOTTOM: #666 0px solid } </style>
<table width="1000" height="1300" cellpadding="0" cellspacing="0" border="0">
    <tbody>
        <tr>
            <td align="center">
 编辑时


效果图

 
 
(3)夜色烟花背景
<style type="text/css"> table{ background-color:transparent; margin-left: 0px !important; } td { background-color:transparent; } body { background-image:url("http://i61.tinypic.com/2i6pekh.jpg") !important; background-attachment:fixed; background-repeat:repeat; background-position:center; font-size_replace:16; color:white !important; } A:link { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:hover { &#160;&#160;&#160;&#160;&#160;&#160; COLOR:#2a544b; BACKGROUND-COLOR: #ffffcc; TEXT-DECORATION: underline } A:visited { &#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:active { &#160;&#160;&#160;&#160;&#160;&#160; TEXT-DECORATION: none } #postbody { &#160;&#160; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 970px! important; PADDING-TOP: 0px } #postbodyTABLE { &#160;&#160;&#160;&#160;&#160;&#160;&#160; MARGIN-LEFT: 0px! important } .bookmark { &#160;&#160;&#160;&#160;&#160; PADDING-RIGHT: 8px; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 8px; OVERFLOW: hidden; WIDTH: 970px; PADDING-TOP: 8px; BORDER-BOTTOM: #666 0px solid } </style>
<table width="1000" height="1300" cellpadding="0" cellspacing="0" border="0">
    <tbody>
        <tr>
            <td align="center">

编辑时


效果:

 
 
(4)人像例子(供参考放人像的位置)
<style type="text/css"> table{ background-color:transparent; margin-left: 0px !important; } td { background-color:transparent; } body { background-image:url("http://i61.tinypic.com/nl545c.jpg") !important; background-attachment:fixed; background-repeat:repeat; background-position:center; font-size_replace:16; color:white !important; } A:link { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:hover { &#160;&#160;&#160;&#160;&#160;&#160; COLOR: #2a544b; BACKGROUND-COLOR: #ffffcc; TEXT-DECORATION: underline } A:visited { &#160;&#160;&#160;&#160;&#160;&#160;&#160; FONT-SIZE: 10.5pt; COLOR: #2a544b; TEXT-DECORATION: none } A:active { &#160;&#160;&#160;&#160;&#160;&#160; TEXT-DECORATION: none } #postbody { &#160;&#160; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; OVERFLOW: visible; WIDTH: 970px! important; PADDING-TOP: 0px } #postbody TABLE { &#160;&#160;&#160;&#160;&#160;&#160;&#160; MARGIN-LEFT: 0px! important } .bookmark { &#160;&#160;&#160;&#160;&#160; PADDING-RIGHT: 8px; PADDING-LEFT: 8px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 8px; OVERFLOW: hidden; WIDTH: 970px; PADDING-TOP: 8px; BORDER-BOTTOM: #666 0px solid } </style>
<table width="1000" height="1300" cellpadding="0" cellspacing="0" border="0">
    <tbody>
        <tr>
            <td align="center">
编辑时


效果


 
希望我交代的清楚,祝大家上贴愉快!

所有跟帖: 

雪m 好人啊!不过一急,理解成“和平时写贴”,心里嘀咕难道还有战争时写贴 :) :) :) -珊瑚茎- 给 珊瑚茎 发送悄悄话 (0 bytes) () 02/24/2015 postreply 21:48:47

嗯,没理解错,写帖时要保持心境平和,出来的帖才更好看。哈哈,你真可爱!强Co.雪M大好人!非常感谢,我又长本事了! -小七宝- 给 小七宝 发送悄悄话 (0 bytes) () 02/25/2015 postreply 05:09:25

哈哈哈,你们都太逗了,和平时要写,战争时也要写,都要心境平和地写,哈 -SnowFallingOnWater- 给 SnowFallingOnWater 发送悄悄话 SnowFallingOnWater 的博客首页 (0 bytes) () 02/25/2015 postreply 05:50:44

test the template -美丽的新疆喀纳斯湖 -我边走边问- 给 我边走边问 发送悄悄话 我边走边问 的博客首页 (1770 bytes) () 02/25/2015 postreply 06:11:20

Very nice template and code ! -我边走边问- 给 我边走边问 发送悄悄话 我边走边问 的博客首页 (0 bytes) () 02/25/2015 postreply 06:13:38

美丽的喀纳斯湖--谢谢摸版 ! -我边走边问- 给 我边走边问 发送悄悄话 我边走边问 的博客首页 (1801 bytes) () 02/25/2015 postreply 06:26:48

不客气。很高兴你喜欢这个模板 -SnowFallingOnWater- 给 SnowFallingOnWater 发送悄悄话 SnowFallingOnWater 的博客首页 (0 bytes) () 02/25/2015 postreply 06:32:33

雪M真贴心。 多谢!! -小三儿她姐- 给 小三儿她姐 发送悄悄话 (0 bytes) () 02/25/2015 postreply 07:03:58

不客气,等看你的帖哈 -SnowFallingOnWater- 给 SnowFallingOnWater 发送悄悄话 SnowFallingOnWater 的博客首页 (0 bytes) () 02/25/2015 postreply 07:31:07

谢谢雪妹无私分享, big hugs。 一直特别喜欢你的模版呢, 我赶紧收藏起来:) -揽香- 给 揽香 发送悄悄话 (0 bytes) () 02/25/2015 postreply 07:11:37

要求看揽香的新帖 :O))))).........回抱 -SnowFallingOnWater- 给 SnowFallingOnWater 发送悄悄话 SnowFallingOnWater 的博客首页 (0 bytes) () 02/25/2015 postreply 07:33:12

谢谢分享,帖子越来越文艺了 -40er- 给 40er 发送悄悄话 40er 的博客首页 (0 bytes) () 02/25/2015 postreply 08:34:01

这个一定要冒个泡,点个赞,感个谢 -Diana-Sun- 给 Diana-Sun 发送悄悄话 Diana-Sun 的博客首页 (42 bytes) () 02/25/2015 postreply 08:59:12

赞雪妹真用心!我看到密密麻麻我就晕了呢:) -Bluebell- 给 Bluebell 发送悄悄话 Bluebell 的博客首页 (0 bytes) () 02/25/2015 postreply 09:01:49

我也一样,水深啊,我就简单的上图就很开心了。不过还是收藏了,谢谢雪花。 -womaninhome- 给 womaninhome 发送悄悄话 womaninhome 的博客首页 (0 bytes) () 02/26/2015 postreply 08:31:49

Me too. -coconina- 给 coconina 发送悄悄话 coconina 的博客首页 (0 bytes) () 02/26/2015 postreply 14:14:02

太复杂了。电脑白痴如我能上贴就已经沾沾自喜了, 这个只能欣赏别人家了。 -一烟绕云间- 给 一烟绕云间 发送悄悄话 (0 bytes) () 02/25/2015 postreply 11:04:53

写的好详细, 但愿我下次发帖会学会。 谢谢雪妹。 -涓涓泉水- 给 涓涓泉水 发送悄悄话 涓涓泉水 的博客首页 (0 bytes) () 02/26/2015 postreply 08:39:21

一起谢谢楼上喜欢这个摸版的姐妹,其实你不需要读码,只要拷贝1码在最前面,2码在最后就可以了。祝大家都美丽开心 -SnowFallingOnWater- 给 SnowFallingOnWater 发送悄悄话 SnowFallingOnWater 的博客首页 (0 bytes) () 02/26/2015 postreply 09:10:05

我应该谢你才对, 真的很漂亮,真羡慕你有那么多闺蜜, 你的红色白刺绣花旗袍真漂亮, 很提气! -我边走边问- 给 我边走边问 发送悄悄话 我边走边问 的博客首页 (0 bytes) () 02/26/2015 postreply 18:45:52

谢谢推荐! -逍遥白鹤- 给 逍遥白鹤 发送悄悄话 逍遥白鹤 的博客首页 (0 bytes) () 02/26/2015 postreply 10:41:58

谢谢雪美女无私分享,赞哦。 -coconina- 给 coconina 发送悄悄话 coconina 的博客首页 (0 bytes) () 02/26/2015 postreply 14:15:25

谢谢雪妹分享有时间一定试试:) -XL彩虹- 给 XL彩虹 发送悄悄话 XL彩虹 的博客首页 (0 bytes) () 02/28/2015 postreply 06:42:10

谢谢雪妹的慷慨分享。 -天边的蔷薇- 给 天边的蔷薇 发送悄悄话 天边的蔷薇 的博客首页 (0 bytes) () 03/01/2015 postreply 12:03:02

加跟帖:

当前帖子已经过期归档,不能加跟帖!