作者versitility (ID 越长,责任越大。)
看板Blog
标题[Blogger][分享] 自订各篇文章独立背景
时间Thu Oct 29 16:35:57 2009
首先要先感谢 huanson 大大给我关键性的观念指导才得以让我在此分享这篇心得。
<0>
---
先贴上完成後网站给各位参考:
http://virsitilityj.blogspot.com/
这篇文章要讨论的是如何自订自已喜欢的图片在各篇独立的文章,
我本来的想法是要给各篇文章评分,
让我/来参观的人可以筛选出一些比较有可看性的文章。
以下是基本做法教学:
登入後,在自已的首页右上角按"自订"->"修改HTML",
在画面中间有个 "口展开小装置范本" 打勾,
搜寻 "
/* Posts" 这段文字,
用以找出负责处理文章的程式码,把下面的程式加进去,以後比较好整理。
这是我用的范本的情况,如果其他的范本写法和我的不一样,
请各位自已要记住把程式码加到哪里去了,以後要修改才不会搞半天。
找到之後就要来新增自订的背景了。
--以下为程式码--
.star1-body {
background:url("图片网址") no-repeat 400px .5em;
}
--以上为程式码--
.star1-body - "." 在 html 语法里面是新增一个 class 的意思,後面就是你要创建的
class 的名称,可以自已订。
background:url("图片网址") - 填入自已的图片网址。
no-repeat - 设定图片不重复贴在背景上。
400px - 因为我的 blog 宽度是 1000px,所以我把自订的背景图贴在左边文章列的
400px 处,这边多试几次就可得到最佳位置。
.5em - ...这边我是照程式码内建的抄下来的,所以不太清楚,只知道砍掉图片就显示不
出来了,麻烦知道的大大指点了。
最後要记得加上 "
;"。
如果你有三张图,就得加入三组上面的程式,所以加完就会有
star1-body,
star2-body,
star3-body 三组 class(以我的三组名称为例),
接着,在编辑新文章时,切换到 "修改html" 模式,
在
本文的最前面和最後面用 div 包住,
例:
未更改的本文:
今天天气好
好得不得了
可以去郊游
加入背景图的程式码:
<div class='star1-body'>
今天天气好
好得不得了
可以去郊游
</div>
完成貌:
http://virsitilityj.blogspot.com/
---
其实这不只可以用来做文章评等,还能改成这篇文章的心情(喜怒哀乐的图),
图示化标签(Label)...等,
相信这只是基础的土法练钢技,还有大大有更简便的方法,
只是提供个简单的修改让不会程式的大家能美化自已的部落格,
如果有什麽问题也可以提出来一起讨论。
谢谢(鞠躬~
--
***大金刚***
三支女大十一金三支女大十一金三支女大十一金三支女大十一金三支女大十一金
金一十大女支三金一十大女支三金一十大女支三金一十大女支三金一十大女支三
三支女大十一金三支女大十一金三支女大十一金三支女大十一金三支女大十一金
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 122.123.85.125
1F:推 huanson:给推! 因为我觉得原PO的想法很特殊, 好像还没看过 10/29 21:18
2F:→ huanson:有人这样作, 所以我就帮原PO实现愿望. 同时原PO也很厉害 10/29 21:19
3F:→ huanson:我刚好电脑坏了 所以写得很简略 没想到他竟然看懂了 10/29 21:20
4F:推 gunner:推你们的交流~~~ 10/30 00:11
5F:→ versitility:只是有点程式概念+查资料而已 说不上厉害啦 "囧> 10/30 22:27
※ 编辑: versitility 来自: 122.123.81.10 (10/31 01:31)