常用特效代码以及META标签的作用
2005-06-22 15:38
573 查看
[align=left]1.镶入整个网页的代码: <IFRAME align=center name=smsbrowse_18121_17 src="你的网址" frameborder=0 width="宽度" height="高度" scrolling="no"></IFRAME> 2.下雨的代码: <center><EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" align=right src=http://www.cn898.net /bg/6.swf width=700 height=400 type=application/x-shockwave-flash wmode="transparent" quality="high" ;></center> 3.片片绿叶飞动的代码: <center><EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" align=right src=http://www.cn898.net /bg/fh/2/700.swf width=700 height=400 type=application/x-shockwave-flash wmode="transparent" quality= "high" ;></center> 4.把图片设置为背景: <body background="图片地址"> 5.水滴特效代码: <center><EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" align=right src=http://scount.jahee.com/model/fishandwaterflash/drip.swf width=700 height=400 type=application/ x-shockwave-flash wmode="transparent" quality="high" ;></center> 6.金鱼特效代码: <center><EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" align=right src=http://www.52flash.net/upfile/fla/20043/200433118563782902.swf width=700 height=400 type=application /x-shockwave-flash wmode="transparent" quality="high" ;></center> 7.在网站中插入mediaplay视频 <EMBED src="http://diy.china001.com/telecom2/business.wmv"; width="499" height="356" type="audio/x-wav" loop="true" autostart="true"></EMBED> 注:如插文件档中,记住要在"html源码编辑器"中插入。上述代码中:src="视频地址" ,width="视频宽度" ,height ="视频高度" ,loop="true" 表示循环播放。 8.添加背景音乐 第一种:先下载,鼠标指向你喜欢的歌名(如:缘分天空),单击右键,选择目标另存为,单击左键,选择存储的位置 (如:我的文档)点保存。 再上传,在网页制作系统里,点击浏览,选择你保存的歌曲文件名(如:yftk),点打开, 要上传的文件在浏览中出现,再点上传,点确定。(完成了下载上传) 在网页编辑器中插入音乐:先将下面的代码 <bgsound src="wmdsh[1].rmi" loop="-1"> 复制并粘贴到插入Script代码中,在修改歌曲文件名,(将wmdsh[1]改为 yftk或其他你已经上传的歌曲文件名。注意,小点(.)不能去掉。) 第二种:直接将现成的代码 <bgsound src="******"; loop="-1"> 复制并粘贴到插入自定义区块中。 9.FLAHS动态主页代码 <center><EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" align=right src=http://www.cn898.net/ bg/5.swf width=700 height=400 type=application/x-shockwave-flash wmode="transparent" quality="high" ;> </center> 高度height,宽度width随图大小可调 src= FLASH地址 10.网页中加入Flash的代码 <embed src="http://cartoonfile.163.com/source/47192/ai2.swf";width="400" height="400"> </embed> 11.聊天室代码 <script language="javascript"> <br> <!-- start of vp login script --> <script> function xsetcookie(name, value){ documents.cookie=name+"="+escape(value); } function EnterRoom(){ if ( this.document.loginform. UserID.value == ""){ alert('用户代号不能为空'); return; } window.open('','vpchat','fullscreen=0,toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable =1'); this.document.loginform.submit(); } function xGetCookie(Name) { var search = Name + "=" var return Value = ""; if (documents.cookie.length > 0) { var offSet = documents.cookie.indexOf(search); if (offSet != -1) { // if cookie exists offSet += search.length; // set index of beginning of value end = document. cookie.indexOf(";", offSet); // set index of end of cookie value if (end == -1)end = documents.cookie.length; returnValue=unescape(documents.cookie.substring(offSet, end)); } } return returnValue; } </script><form name="loginform" target="vpchat" id="Form1" method="post" action = "http://vchat.xihai.net/login.aspx";> <p> 昵称: <input type="text" name="UserID" size="20" > <br> 密码(可无): <input type="password" name= "UserPass" size="20" > <br> <input type="hidden" name="RoomID" value='zh918' size="20" > <br> <input type="button" value= '进入房间' onclick=javascript:EnterRoom()></p> </p> </form> <!-- end of vp login script --> 12.一款顶部动态图代码 <CENTER> <EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" align=right src=http://www.cn898.net /bg/10.swf width=600 height=250 type=application/x-shockwave-flash wmode="transparent" quality="high" ;> </CENTER> <center><EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" align=right src=http://www.cn898.net/ bg/9.swf width=700 height=400 type=application/x-shockwave-flash wmode="transparent" quality="high" ;> </center> 13.在背景图片上写字代码 <table background="图片" width=100% height=100%> <tr> <td> 文字内容 </td> </tr> </table> 14.阴影文字的特殊效果 1、第一种效果[修改要显示的文字即可] <div style="left:290;width:350; font-size:15pt; font-family: Arial ; color: red; position: relative; filter: blur(add=1, direction=45, strength=3)">网页制作特效百宝箱</div> 2.第二种效果[修改要显示的文字即可] <div style="left:290; width:350; font-size:15pt; font-family: Arial ; color: red; position: relative; filter: glow(color=ffff00, strength=5)">网页制作特效百宝箱</div> 3.第三种效果[修改要显示的文字即可] <div style="left:290;width: 350; font-size:15pt; font-family: Arial ; color: red; position: relative; filter: dropshadow(color=000000, offx=3, offy=3, positive=1)"> 网页制作特效百宝箱</div> 15.改变IE地址栏的IE图标 要先做一个16*16的icon(图标文件),保存为index.ico。把这个图标文件上传到根目录下并在首页<head></head> 之间加上如下代码: <link REL = "Shortcut Icon" href="index.ico"> 16.邮箱登陆代码 <form name="loginmail" onsubmit="return chkinput2(this);" action="http://2000x.com/send_mail.asp"; method ="post" target=_blank> <table align="center" width="100" border="0"> <tr> <td align="center"> 账号:<BR> <input type="text" name="user" size="12" class="input1"> <BR> 密码:<BR> <input type="password" name="pass" size="12" class="input1"> <BR> 请选择您的邮局:<BR><select name="site"> <BR> <option value="" selected>选择信箱</option> <option value="21cn.com">@21cn.com</option> <option value="163.net">@163.net</option> <option value="tom.com">@tom.com</option> <option value="163.com">@163.com</option> <option value="vip.163.com">@vip.163.com</option> <option value="sohu.com">@sohu.com</option> <option value="263.net">@263.net</option> <option value="sina.com">@sina.com</option> <option value="vip.sina.com">@vip.sina.com</option> <option value="mail.china.com">@mail.china.com</option> <option value="china.com">@china.com</option> <option value="263.net">@netease.com</option> <option value="yeah.net">@yeah.net</option> <option value="etang.com">@etang.com</option> <option value="fm365.com">@fm365.com</option> <option value="yahoo.com.cn">@yahoo.com.cn</option> <option value="xinhuanet.com">@xinhuanet.com</option> <option value="126.com">@126.com</option> <option value="qs163.com">@qs163.com</option> </select> <BR> <input type="submit" name="s1" class="button1" value=" 登陆邮箱 "> </td> </tr> </table> </form> 17.网页防复制代码 <SCRIPT LANGUAGE=javascript> function click() { alert('需要复制,请与站长联系!') } function click1() { if (event.button==2) {alert('需要复制,请与站长联系!') }} function CtrlKeyDown(){ if (event.ctrlKey) {alert('不当的拷贝将损害您的系统!') }} document.onkeydown=CtrlKeyDown; document.onselectstart=click; document.onmousedown=click1; </SCRIPT> 18.IE地址栏前换成自己的图标 <link rel="Shortcut Icon" href="favicon.ico"> 说明:关于favicon.ico文件的制作。你可以先在FW中做一个图片,属于你自己站点一个小图标。然后在ACD see将文件 属性改为*.ico,然后将你做的*.ICO文件传到你的服务器目录中,然后就可以使用以上代码来实现,当别人登陆你的站 点时,地址栏里使用的就是你自定义的图标了。 19.可以在收藏夹中显示出你的图标 <link rel="Bookmark" href="favicon.ico"> 说明:制作方法和上面的一样。只是显示的方式不同,这个是在别人收藏你的网页地址时显示的个性图标。 ********************************************************************************************* 网页制作中META标签的作用 引言 您的个人网站即使做得再精彩,在“浩瀚如海”的网络空间中,也如一叶扁舟不易为人发现,如何推广个人网站, 人们首先想到的方法无外乎以下几种: l 在搜索引擎中登录自己的个人网站 l 在知名网站加入你个人网站的链接 l 在论坛中发帖子宣传你的个人网站 很多人却忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你的个人网站被搜索到的可能性, 有兴趣吗,谁我来重新认识一下META标签吧! META标签,是HTML语言HEAD区的一个辅助性标签。在几乎所有的page里,我们都可以看到类似下面这段html代码: <head> <meta http-equiv=Content-Type content=texthtml; charset=gb2312> <head> 这就是META标签的典型应用,标识page所采用的编码类型。根据HTML语言标准注释:META标签是对网站发展非常重 要的标签,它可以用于鉴别作者,设定页面格式,标注内容提要和关键字,以及刷新页面等等。 详细介绍 META标签分两大部分:HTTP-EQUIV和NAME变量。 参数HTTP-EQUIV HTTP-EQUIV类似于HTTP的头部协议,它给浏览器回应一些有用的信息,以帮助正确地显示网页内容。常用的HTTP- EQUIV类型有: A. Expires(期限) 说明:可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新调阅。 用法:<META HTTP-EQUIV=expires CONTENT=Wed, 26 Feb 1997 082157 GMT> 注意:必须使用GMT的时间格式。 B. Pragma(cache模式) 说明:禁止浏览器从本地机的缓存中调阅页面内容。 用法:<META HTTP-EQUIV=Pragma CONTENT=no-cache> 注意:这样设定,访问者将无法脱机浏览。 C. Refresh(刷新) 说明:需要定时让网页自动链接到其它网页的话,就用这句了。 用法:<META HTTP-EQUIV=Refresh CONTENT=5;URL=httpwww.yahoo.com> 注意:其中的5是指停留5秒钟后自动刷新到URL网址。 D. Set-Cookie(cookie设定) 说明:如果网页过期,那么存盘的cookie将被删除。 用法:<META HTTP-EQUIV=Set-Cookie CONTENT=cookievalue=xxx; expires=Wednesday, 21-Oct-98 161421 GMT; path=> 注意:必须使用GMT的时间格式。 E. Window-target(显示窗口的设定) 说明:强制页面在当前窗口以独立页面显示。 用法:<META HTTP-EQUIV=Window-target CONTENT=_top> 注意:用来防止别人在框架里调用你的页面。 F. Content-Type(显示字符集的设定) 说明:设定页面使用的字符集。 用法:<META http-equiv=Content-Type content=texthtml; charset=gb2312> 注意:游览器会根据此来调用相应的字符集显示page内容 G. Pics-label(网页等级评定) 说明:在IE的Internet选项中有一项内容设置,可以防止浏览一些受限制的网站,而网站的限制级别就是通过该参 数来设置的。 用法:<META http-equiv=”Pics-label” contect=””> 注意:不要将级别设置的太高。 参数NAME META标签的NAME变量语法格式是: <META NAME=xxx CONTENT=xxxxxxxxxxxxxxxxxx> 其中xxx主要有下面几种参数: 1. Keywords(关键字) 说明:Keywords用来告诉搜索引擎你网页的关键字是什么。 举例:<META NAME =keywords CONTENT=life, universe, mankind, plants, relationships, the meaning of life, science> 2. Description(简介) 说明:Description用来告诉搜索引擎你的网站主要内容。 举例:<META NAME=Description CONTENT=主要介绍程序设计语言JAVA、C等> 3. Robots(机器人向导) 说明:Robots用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。CONTENT的参数有all、none、index、 noindex、follow、nofollow。默认是all。 举例:<META NAME=Robots CONTENT=none> 4. Author(作者) 说明:标注网页的作者 举例:<META name=AUTHOR content=张三,abc@sina.com”> 用例分析 以上是META标签的一些基本用法,其中最重要的就是:Keywords和Description的设定。为什么呢? 道理很简单,这两个语句可以让搜索引擎能准确的发现你,吸引更多的人访问你的站点!根据现在流行搜索引擎 (Google,Lycos,AltaVista等)的工作原理,搜索引擎先派机器人自动在WWW上搜索,当发现新的网站时,便检索页 面中的Keywords和Description,并将其加入到自己的数据库,然后再根据关键词的密度将网站排序。 由此看来,我们必须记住添加Keywords和Description的META标签,并尽可能写好关键字和简介。否则,后果就 会是: 2 如果你的页面中根本没有Keywords和Description的META标签,那么机器人是无法将你的站点加入数据库,网 友也就不可能搜索到你的站点。 2 如果你的关键字选的不好,关键字的密度不高,被排列在几十甚至几百万个站点的后面被点击的可能性也是非 常小的。 写好Keywords(关键字)要注意以下几点: l 不要用常见词汇。例如www、homepage、net、web等。 l 不要用形容词,副词。例如最好的,最大的等。 l 不要用笼统的词汇,要尽量精确。例如“爱立信手机”,改用“T28SC”会更好。 “三人之行,必有我师”,寻找合适关键词的技巧是:到Google、Lycos、Alta等著名搜索引擎,搜索与你的网站 内容相仿的网站,查看排名前十位的网站的META关键字,将它们用在你的网站上,效果可想而知了。 小窍门 为了提高搜索点击率,这里还有一些“捷径”可以帮得到你: ü 为了增加关键词的密度,将关键字隐藏在页面里(将文字颜色定义成与背景颜色一样)。 ü 在图像的ALT注释语句中加入关键字。 如:<IMG SRC=xxx.gif Alt=Keywords> ü 利用HTML的注释语句,在页面代码里加入大量关键字。 用法: <!-- 这里插入关键字 --> [/align] |
相关文章推荐
- meta标签作用?常用的http-equiv属性及其作用
- Meta标签常用属性值的写法和作用
- (转)关于jsp页面中的pageEncoding和contentType以及html中的<meta标签中字符集的设置
- meta 标签的作用
- 常用meta 标签
- HTML常用特效代码
- Html中meta标签的用法和作用
- button设置圆角代码----以及一些常用的属性
- <meta>标签的作用
- HTML文档中小meta标签的大作用
- 常用的Python模块以及主要作用
- HTML 4 常用标签有哪些,都有哪些作用
- JSP、EL表达式以及JSTL常用标签的用法
- 常用META标签整理和SEO优化
- META标签的使用摘录,网页跳转特效
- 代码规范和常用的js插件以及测试工具
- 网页常用特效代码整理
- 【转】网页HTML代码中Meta标签详解
- Struts配置文件详解,web.xml以及struts-cofig.xml,以及struts-cofig.xml中各个标签的作用
- 移动开发中Meta标签的常用属性设置