注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

洞庭风帆

 
 
 

日志

 
 
关于我

从军校到部队,造就了军人的性格,从工厂到机关,完善了人生的历练。 岁月如歌,人生磋砣。“长风破浪会有时, 直挂云帆济沧海”!

网易考拉推荐

引用 采用定位控制指令制图的方法  

2009-06-02 21:04:26|  分类: 博海拾贝 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

 

引用

东方洋采用定位控制指令制图的方法
 引用 采用定位控制指令制图的方法 - 洞庭风帆 - 洞庭风帆的博客  引用 采用定位控制指令制图的方法 - 洞庭风帆 - 洞庭风帆的博客引用 采用定位控制指令制图的方法 - 洞庭风帆 - 洞庭风帆的博客

 

 

 

采用定位控制指令制图的方法

 

  在用代码制图中,常会遇到在背景图片叠加Flash后,很难再加入文字。

此时,可采取加入定位控制指令来解决。采用定位控制指令,还可在背景图的多

个位置上插入图文,甚至比左中右指令更为灵活实用,从而更为有效的实现你的

创意。下面我们通过一步步具体操练来理解和掌握这种实用技法。

                                                        设置一个规定范围的表格,代码如下:


<TABLE style=" ridge; LEFT: 0px; ridge; WIDTH: 500px; ridge; POSITION: relative; TOP: 0px; HEIGHT: 350px"

background=http://img.photo.163.com/abSgsBXyHD5j0PJg7A8ZbQ==/731553464471584788.jpg

border=3>
<TR>
<TD>
</TD></TR></TABLE>
</TD></TR></TABLE>



效果显示图:

 
 
在图框中叠加一组动画图片.代码如下:

<CENTER>
<TABLE id=table style=" ridge; LEFT: 0px; ridge; WIDTH: 500px; ridge; POSITION: relative; TOP: 0px; HEIGHT: 350px"

background=http://img.photo.163.com/abSgsBXyHD5j0PJg7A8ZbQ==/731553464471584788.jpg

border=3>
<TR>
<TD>
<TABLE cellSpacing=3 cellPadding=3 width=500 bordercolor=0000ff background= border=1>
<TR><TD>
<EMBED align=right src=http://imgfree.21cn.com/free/flash//17.swf width=500 height=350 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<EMBED align=right src=http://my.e-yu.cn/cxq/sc/005shuizhu_1.swf width=480 height=350 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<EMBED align=right src=http://imgfree.21cn.com/free/flash//17.swf width=450 height=300 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<EMBED align=right src=http://my.e-yu.cn/cxq/sc/005shuizhu_1.swf width=500 height=350 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<EMBED align=right src=http://my.e-yu.cn/cxq/sc/005shuizhu_1.swf width=500 height=330 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
</TD></TR></TABLE>
</TD></TR></TABLE></CENTER>



  
说明:
  在上面代码中插入5层后辍为" .swf"的Flash图片。
  插入的Flash代码:
<EMBED align=right src=http://imgfree.21cn.com/free/flash//17.swf width=500 height=350 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>



效果显示图:
 


下面再叠加图片和文字,代码如下:


<CENTER>
<TABLE style=" ridge; LEFT: 0px; ridge; WIDTH: 500px; ridge; POSITION: relative; TOP: 0px; HEIGHT: 350px" background=http://img.photo.163.com/abSgsBXyHD5j0PJg7A8ZbQ==/731553464471584788.jpg border=3>
<TR>
<TD>
<TABLE cellSpacing=3 cellPadding=3 width=500 bordercolor=0000ff background= border=1>
<TR><TD>
<EMBED align=right src=http://imgfree.21cn.com/free/flash//17.swf width=500 height=350 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<EMBED align=right src=http://my.e-yu.cn/cxq/sc/005shuizhu_1.swf width=480 height=350 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<EMBED align=right src=http://imgfree.21cn.com/free/flash//17.swf width=450 height=300 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<EMBED align=right src=http://my.e-yu.cn/cxq/sc/005shuizhu_1.swf width=500 height=350 type=application/octet-stream
wmode="transparent" quality="high" ;;></EMBED>
<EMBED align=right src=http://my.e-yu.cn/cxq/sc/005shuizhu_1.swf width=500 height=330 type=application/octet-stream wmode="transparent" quality="high" ;;></EMBED>
<TABLE id=table2 style="LEFT: 350px; ridge; WIDTH: 180px; ridge; POSITION: absolute; TOP: 20px; HEIGHT: 100px">
<TR>
<TD>
<INPUT style="FILTER: alpha(opacity=100,style=2)" type=image height=180 width=180 src="http://www.tyfo.com/10399/tyfo/ent/27_images/entwl060808t2.jpg">
</TD></TR></TABLE>
<TABLE style="LEFT: 10px; ridge; WIDTH: 120px; ridge; POSITION: absolute; TOP: 50px; HEIGHT: 100px">
<TR><TD>
<FONT style="FONT-SIZE: 30pt; FILTER: shadow color=apar); WIDTH: 200%; COLOR: #fff000; LINE-HEIGHT: 150%" face=隶书>
欢<br>迎<br>欣<br>赏
</FONT>
</TD></TR></TABLE>
<TABLE id=table2 style="LEFT: 100px; ridge; WIDTH: 400px; ridge; POSITION: absolute; TOP: 300px; HEIGHT: 100px">
<TR><TD>
<FONT style="FONT-SIZE: 20pt; FILTER: shadow color=apar); WIDTH: 200%; COLOR: #00ff00; LINE-HEIGHT: 150%" face=隶书>
网海存知已 隔屏若比邻—东方洋</FONT>
</TD></TR></TABLE>
</TD></TR></TABLE></TD></TR></TABLE>


  
说明:
  用定位控制指令叠加图片、竖排文字和横排文字等三层效果。
  
加入的羽化图片代码:
<TABLE style="LEFT: 350px; ridge; WIDTH: 180px; ridge; POSITION: absolute; TOP: 20px; HEIGHT: 100px">
<TR>
<TD>
<INPUT style="FILTER: alpha(opacity=100,style=2)" type=image height=180 width=180

src="http://www.tyfo.com/10399/tyfo/ent/27_images/entwl060808t2.jpg">
</TD></TR></TABLE>

  加入的竖排文字代码:

<TABLE style="LEFT: 10px; ridge; WIDTH: 120px; ridge; POSITION: absolute; TOP: 50px; HEIGHT: 100px">
<TR><TD>
<FONT style="FONT-SIZE: 30pt; FILTER: shadow color=apar); WIDTH: 200%; COLOR: #fff000; LINE-HEIGHT: 150%" face=隶书>
欢<br>迎<br>欣<br>赏
</FONT>
</TD></TR></TABLE>

  加入的横排文字代码:

<TABLE style="LEFT: 100px; ridge; WIDTH: 400px; ridge; POSITION: absolute; TOP: 300px; HEIGHT: 100px">
<TR><TD>
<FONT style="FONT-SIZE: 20pt; FILTER: shadow color=apar); WIDTH: 200%; COLOR: #00ff00; LINE-HEIGHT: 150%" face=隶书>
网海存知已 隔屏若比邻—东方洋</FONT>
</TD></TR></TABLE>



效果显示图:




网海存知已 隔屏若比邻 东方洋


 
定位控制指令应用实例代码:



<DIV style="LEFT: -10px; WIDTH: 760px; POSITION: relative; TOP: 0px">
<TABLE style="BORDER-LEFT-COLOR: #8c8c00; BORDER-BOTTOM-COLOR: #8c8c00; BORDER-TOP-STYLE: ridge; BORDER-TOP-COLOR: #8c8c00; BORDER-RIGHT-STYLE: ridge; BORDER-LEFT-STYLE: ridge; BORDER-RIGHT-COLOR: #8c8c00; BORDER-BOTTOM-STYLE: ridge" height=580 cellSpacing=0 cellPadding=0 width="100%" background=http://banbridge.vip.myrice.com/wallpapers/Bashang.JPG border=22>
<TBODY>
<TR>
<TD>
</p></TD></TR></TBODY></TABLE><BR><BR><BR><BR>
<EMBED style="LEFT:10px; WIDTH: 750px; POSITION: absolute; TOP: 10px; HEIGHT: 300px" align=center src=http://imgfree.21cn.com/free/flash/59.swf width=750 height=300 type=application/octet-stream ;; quality="high" wmode="transparent"></EMBED>
<EMBED style="LEFT: 250px; WIDTH: 480px; POSITION: absolute; TOP: 200px; HEIGHT: 200px" align=center src=http://youngcolor.com.ne.kr/swf1/24.swf width=180 height=100 type=application/octet-stream ;; quality="high" wmode="transparent"></EMBED>
<EMBED style="LEFT: 50px; WIDTH: 600px; POSITION: absolute; TOP: 260px; HEIGHT: 400px" align=center src=http://youngcolor.com.ne.kr/swf1/24.swf width=650 height=400 type=application/octet-stream ;; quality="high" wmode="transparent"></EMBED>
<EMBED style="LEFT: 200px; WIDTH: 700px; POSITION: absolute; TOP: 200px; HEIGHT: 300px" align=center src=http://imgfree.21cn.com/free/flash/51.swf width=700 height=300 type=application/octet-stream ;; quality="high" wmode="transparent"></EMBED> <BR><BR>
<TABLE style="LEFT: 80px; ridge; WIDTH: 120px; ridge; POSITION: absolute; TOP: 20px; HEIGHT: 100px">
<TR><TD>
<FONT style="FONT-SIZE: 60pt; FILTER: shadow(color=yellow); WIDTH: 100%; COLOR: navy; LINE-HEIGHT: 150%; FONT-FAMILY: 华文彩云"><B>掌握博客技法</B></FONT>
</FONT>
</TD></TR></TABLE>
<TABLE id=table2 style="LEFT: 180px; ridge; WIDTH: 520px; ridge; POSITION: absolute; TOP:500px; HEIGHT:60px">
<TR><TD>
<P align=center><FONT style="FONT-SIZE: 30pt; FILTER: shadow(color=silvergreen); WIDTH: 100%; COLOR:00ff00; LINE-HEIGHT: 150%; FONT-FAMILY: 华文行楷">
东方洋祝您创意美丽家园
</FONT></P></TD></TR></TABLE>


  说明:
 1、黄色代码是一张加有定位控制指令的图框。
 2、蓝色代码是叠加的四组Flash图片。
 3、红色代码是两组加叠在Flash中的文字。
 注意:在Flash中叠加文字,必须用定位表格才能正常显示。

 


效果显示图:


欢迎朋友光临风帆家园


        1968448032.gif   东方洋家园

 

           请印:  引用 采用定位控制指令制图的方法 - 洞庭风帆 - 洞庭风帆的博客

      引用 采用定位控制指令制图的方法 - 洞庭风帆 - 洞庭风帆的博客   引用 采用定位控制指令制图的方法 - 洞庭风帆 - 洞庭风帆的博客  引用 采用定位控制指令制图的方法 - 洞庭风帆 - 洞庭风帆的博客

 

 

    

  评论这张
 
阅读(22)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017