简体
|
繁体
loading...
海外博客
按全文
按作者
首页
新闻
读图
财经
教育
家居
健康
美食
时尚
旅游
影视
博客
群吧
论坛
电台
热点
原创
时政
旅游
美食
家居
健康
财经
教育
情感
星座
时尚
娱乐
历史
文化
社区
帮助
您的位置:
文学城
»
博客
»
石头弟弟制贴讲座二 ZT
石头弟弟制贴讲座二 ZT
2010-09-08 18:30:50
故乡小路
自娱自乐,也希望我的歌声给你带来一丝快乐!
首页
文章页
文章列表
博文目录
给我悄悄话
打印
被阅读次数
石头弟弟制贴讲座二
2010-04-01 17:57:02
/>
/>
/>
自从第一次讲座发出后,同学们反响强烈,尤其让本班高兴的是已经有同学开始使用模版一号,制作的贴子像摸像样,非常棒!希望大家继续努力。
也有的同学反映讲座内容深奥看不懂,无奈本班水平实在有限,自我感觉已经用了最通俗易懂的语言来解释HTML语法了。如果还是看着费劲,就拷贝模版code再换成你自己的图片什么的就行了,别的也不用多研究。
今天的这一讲非常的重要,请同学们做好笔记哈。为什么呢,因为不但俺的很多贴子都是用这个模版做的,还有很多的大腕的贴子也是这个版。这个模版可谓是放之四海而皆准的毛选级别的模版,就作为模版石头二号(其实也是从师傅那里偷来的,嘿嘿)。会用了这个版,你以后就所向无敌了。
本贴子歌曲录音的时候话筒有问题,所以很难听又没有时间重录了,希望大家把上面贴子的音乐播放器关掉,专心学习。
贴子的构思:
首先根据歌词内容找了一张这样的照片,有些网友也曾经用过这个图。一大轮金黄圆月,有神秘的河流和山川,就像梦境。正体现了歌词里描写的意境。
同样写好歌词,调整大小,上传得到图片链接。注意写歌词的时候要让歌词清楚一些,不然看着费劲。这个图片的大小是750X563
图片地址:
http://i42.tinypic.com/2cr3dkp.jpg
写好歌词后,我想再加上以下flash来强调主题:
1) 雾蒙蒙的飘动的云雾,进一步体现梦幻效果。
http://podmedia.imhb.cn/uploadpodmedia/2008/7/6/20080706135757_68639.swf
2) 天空比较单薄,加上了一颗伴月星闪亮。
http://www.leiyu668.com/flash/transparent1/starlight/014.swf
3) 河湾的流水要体现动感,我以后会单独讲水波纹的制作,但现在就靠这个flash来体现:
http://imgfree.21cn.com/free/flash/137.swf
原料都有了就可以做了,显然把这几个flash定位在自己想要的位置非常重要。所以就需要一些定位语句来给flash模块定位。首先第一句开头是这样的:
center: 就是要把贴子放在中间位置显示,这上次讲了
table: 现在要开始一个表单来做贴子,和上次不同的是这次要嵌套表单,后面还会再有一个表单套在这一层里。
tr: 开始表单内的行
td: 开始行的内容
div 的概念说起来会很复杂,你只要记住它的意思是开是一个模块就行了,模块是什么呢,它可以是一个图片,歌曲播放器,flash,或什么别的东西。只要定义在div和/div之内的东西都属于这一个模块。
这第一句的div一句非常重要,有时候会看到一些网友的贴子,flash的位置不对,不在贴子里面。有的贴子在IE里看得好好的,到了firefox看就不对了。或者flash不对或者播放器位置不对,都是因为位置没搞好。这句话就是说以下的这一个模块都相对于最左上角的0X0这个位置而定,后边的所有flash都要“绝对”的定位于这个模块之内。这样就不会出现位置差错了。不管是浏览器是IE也好还是firefox,都不会位置不对。另外你还可以靠Z-INDEX来实现flash模块的层叠显示,这个以后再讲。
你看又一个table开始了,是嵌套在前面的表单里的。这句话定义了整个贴子的大小,因为我的图片像素是750X563的,所以简单起见贴子的高度宽度也设置成同样大小。
边框颜色宽度我第一课已经讲过了。
cellpadding是30,就是说下一个模块(播放器)到边框的距离是30,这个距离可以调整任意大小。
这句话定义了播放器的格式和位置
上节课讲过valign和align, 所以可以看出来,播放器是被放在了下面靠左的位置,但是会留出离边框30像素的距离(由前面的padding决定)。
style="FILTER: Xray" 定义的是播放器的外观,顾名思义x射线就是把播放器显示成黑色透明状的,就像医院里照出来的X光透视片的感觉。但是这个命令在不同版本的浏览器里看效果是不同的。
播放格式是mpeg,是一种比较普通的播放格式,IE和firefox都能听得见。注意这个播放格式和第一节课的realplayer播放格式不一样。
loop播放循环是1,就是说放一次,如果是loop="true" 就是无限循环,不停的放。
至此大table里的小table就结束了,所以要加上/td/tr/table.
这个单元是定义第一个flash动画:云雾效果
在开始的style的地方,我就定位了flash的具体位置,我让它在最左边5个像素开始,上面也留下5个像素的空间。为什么呢,因为我不想让这个云雾飘到边框上去,让flash控制在贴子范围之内。注意position是绝对absolute,不是相对,是让本单元显示的内容把位置定位于第二句的开始点。
flash的宽度和高度是740x500,740=图宽度750-边框5X2=750-10=740
500的高度是让云雾能覆盖画面大部分地方。
这个单元是定义伴月星的flash, 我想让这个星星显示在贴子右上方天空处。它的位置是从上面数负50,只有是负数才能让这个flash显示在比较靠上的位置。
这个单元是定义水波纹的动画效果。它的位置大小也是通过这四个数值来设定的(左右宽高)。变量就是这个四个数字和flash链接。
又一个同样的水波纹,只不过大一些400X400 放在河道宽的地方。
贴子快做完了,注意这些flash动画的单元都是一个模式,只是更换4个变量来改变他们的大小和位置,所以理论上你可以想放多少个flash都可以,多了只不过显示起来会慢一些。
结尾句:
对应开始第一句,这样就结束了这个贴子。
掌握了这个模版,会自如运用了,你就差不多可以毕业了。以后的一些技巧都可以在这个基础上加。
还是那句话,HTML语言只是工具,贴子做得好不好取决于选图flash是不是恰当,好看,字体做的是不是漂亮,等等。所以大家应该多在选图作图上下功夫。
450) this.width=450" src="http://space.wenxuecity.com/media/1243917150.mp3" width="80" height="30" type="audio/mpeg" autostart="true" loop="1" />
/>
450) this.width=450" src="http://podmedia.imhb.cn/uploadpodmedia/2008/7/6/20080706135757_68639.swf" width="740" height="500" type="application/x-shockwave-flash" wmode="transparent" quality="high" />
/>
450) this.width=450" src="http://www.leiyu668.com/flash/transparent1/starlight/014.swf" width="200" height="200" type="applicati on/x-shockwave-flash" wmode="transparent" quality="high" />
/>
450) this.width=450" src="http://imgfree.21cn.com/free/flash/137.swf" width="300" height="300" type="application/x-shockwave-flash" wmode="transparent" quality="high" />
450) this.width=450" src="http://imgfree.21cn.com/free/flash/137.swf" width="400" height="400" type="application/x-shockwave-flash" wmode="transparent" quality="high" />
登录
后才可评论.
今日热点
回国日记(19) 种牙成功了!
laopika
稀土协议的后果来了
老财主说两句
台北福州山步道
下半場共好
美国和近代中国
蒋闻铭
健康的生活方式与享受生活
秋浦四郎
至对川普在俄乌战争立场不理解的中国人
大号蚂蚁
上海师院同学百态图录(之一)
Ohjuice
新车被撞记
nzhu
2025 中国行(六)
longhair
用这种鱼做熏鱼,也是一个不错的选择
feifeigarden
我的外公外婆
小海岸
中共军队金门战役为何失败?
portfolio
大川粉众生相(1) - 陶杰
思想的远行
70岁心态 (下)
越王
一周热点
财富的争夺战: 赢家的代价 (多图)
康赛欧
穷坑,永远填不满!
魅力野花
马斯克“人民革命”的前景如何?(下)
野性de思维
你投川普票后悔么?
BeijingGirl1
到底谁不要脸,老特还是小泽?
朱头山
老年人和财务自由
壁上观
日本731部队
30亩地
HOME DEPOT掉馅饼了
谦谦美君子
发现新大陆,环岛遇同志(图)
菲儿天地
Trump 政府裁员的真正原因
东方明月-
在政府工作过几年,对马斯克裁员的看法
smeagolrocks
王晓棠夫妇的成功人生和悲情人生
毛囡
一位清华教授的感叹:中国学生最大的软肋,是没有自己的观点
sandstone2
美国名校在NIH砍基金中谁最惨
雅美之途