网页特效代码大全
网页特效CSS大全

HTML网页特效CSS大全css属性代码大全一CSS文字属性:color : #999999; /*文字颜色*/font-family : 宋体,sans-serif; /*文字字体*/font-size : 9pt; /*文字大小*/font-style:itelic; /*文字斜体*/font-variant:small-caps; /*小字体*/letter-spacing : 1pt; /*字间距离*/line-height : 200%; /*设置行高*/font-weight:bold; /*文字粗体*/vertical-align:sub; /*下标字*/vertical-align:super; /*上标字*/text-decoration:line-through; /*加删除线*/text-decoration: overline; /*加顶线*/text-decoration:underline; /*加下划线*/text-decoration:none; /*删除链接下划线*/text-transform : capitalize; /*首字大写*/text-transform : uppercase; /*英文大写*/text-transform : lowercase; /*英文小写*/text-align:right; /*文字右对齐*/text-align:left; /*文字左对齐*/text-align:center; /*文字居中对齐*/text-align:justify; /*文字分散对齐*/vertical-align属性vertical-align:top; /*垂直向上对齐*/vertical-align:bottom; /*垂直向下对齐*/ vertical-align:middle; /*垂直居中对齐*/vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/ 二、CSS边框空白padding-top:10px; /*上边框留空白*/padding-right:10px; /*右边框留空白*/padding-bottom:10px; /*下边框留空白*/ padding-left:10px; /*左边框留空白三、CSS符号属性:list-style-type:none; /*不编号*/list-style-type:decimal; /*阿拉伯数字*/list-style-type:lower-roman; /*小写罗马数字*/ list-style-type:upper-roman; /*大写罗马数字*/ list-style-type:lower-alpha; /*小写英文字母*/list-style-type:upper-alpha; /*大写英文字母*/list-style-type:disc; /*实心圆形符号*/list-style-type:circle; /*空心圆形符号*/list-style-type:square; /*实心方形符号*/list-style-image:url(/dot.gif); /*图片式符号*/list-style-position: outside; /*凸排*/list-style-position:inside; /*缩进*/四、CSS背景样式:background-color:#F5E2EC; /*背景颜色*/background:transparent; /*透视背景*/background-image : url(/image/bg.gif); /*背景图片*/ background-attachment : fixed; /*浮水印固定背景*/ background-repeat : repeat; /*重复排列-网页默认*/ background-repeat : no-repeat; /*不重复排列*/ background-repeat : repeat-x; /*在x轴重复排列*/ background-repeat : repeat-y; /*在y轴重复排列*/指定背景位置background-position : 90% 90%; /*背景图片x与y轴的位置*/ background-position : top; /*向上对齐*/background-position : buttom; /*向下对齐*/background-position : left; /*向左对齐*/background-position : right; /*向右对齐*/background-position : center; /*居中对齐*/五、CSS连接属性:a /*所有超链接*/a:link /*超链接文字格式*/a:visited /*浏览过的链接文字格式*/a:active /*按下链接的格式*/a:hover /*鼠标转到链接*/鼠标光标样式:链接手指CURSOR: hand十字体cursor:crosshair箭头朝下cursor:s-resize十字箭头cursor:move箭头朝右cursor:move加一问号cursor:help箭头朝左cursor:w-resize箭头朝上cursor:n-resize箭头朝右上cursor:ne-resize箭头朝左上cursor:nw-resize文字I型cursor:text箭头斜右下cursor:se-resize箭头斜左下cursor:sw-resize漏斗cursor:wait光标图案(IE6) p {cursor:url("光标文件名.cur"),text;}六、CSS框线一览表:border-top : 1px solid #6699cc; /*上框线*/border-bottom : 1px solid #6699cc; /*下框线*/border-left : 1px solid #6699cc; /*左框线*/border-right : 1px solid #6699cc; /*右框线*/以上是建议书写方式,但也可以使用常规的方式如下:border-top-color : #369 /*设置上框线top颜色*/border-top-width :1px /*设置上框线top宽度*/border-top-style : solid/*设置上框线top样式*/其他框线样式solid /*实线框*/dotted /*虚线框*/double /*双线框*/groove /*立体内凸框*/ridge /*立体浮雕框*/inset /*凹框*/outset /*凸框*/七、CSS表单运用:文字方块按钮复选框选择钮多行文字方块下拉式菜单选项1选项2八、CSS边界样式:margin-top:10px; /*上边界*/margin-right:10px; /*右边界值*/margin-bottom:10px; /*下边界值*/margin-left:10px; /*左边界值*/CSS 属性:字体样式(Font Style)序号中文说明标记语法1 字体样式{font:font-style font-variant font-weight font-size font-family}2 字体类型{font-family:"字体1","字体2","字体3",...}3 字体大小{font-size:数值|inherit| medium| large| larger| x-large| xx-large| small| smaller| x-small| xx-small}4 字体风格{font-style:inherit|italic|normal|oblique}5 字体粗细{font-weight:100-900|bold|bolder|lighter|normal;}6 字体颜色{color:数值;}7 阴影颜色{text-shadow:16位色值}8 字体行高{line-height:数值|inherit|normal;}9 字间距{letter-spacing:数值|inherit|normal}10 单词间距{word-spacing:数值|inherit|normal}11 字体变形{font-variant:inherit|normal|small-cps }12 英文转换{text-transform:inherit|none|capitalize|uppercase|lowercase}13 字体变形{font-size-adjust:inherit|none}14 字体{font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit|narrower|normal| semi-condensed|semi-expanded|ultra-condensed|ultra-expanded|wider}文本样式(Text Style)序号中文说明标记语法1 行间距{line-height:数值|inherit|normal;}2 文本修饰{text-decoration:inherit|none|underline|overline|line-through|blink}3 段首空格{text-indent:数值|inherit}4 水平对齐{text-align:left|right|center|justify}5 垂直对齐{vertical-align:inherit|top|bottom|text-top|text-bottom|baseline|middle|sub|super}6 书写方式{writing-mode:lr-tb|tb-rl}背景样式序号中文说明标记语法1 背景颜色{background-color:数值}2 背景图片{background-image: url(URL)|none}3 背景重复{background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y}4 背景固定{background-attachment:fixed|scroll}5 背景定位{background-position:数值|top|bottom|left|right|center}6 背影样式{background:背景颜色|背景图象|背景重复|背景附件|背景位置}框架样式(Box Style)序号中文说明标记语法1 边界留白{margin:margin-top margin-right margin-bottom margin-left}2 补白{padding:padding-top padding-right padding-bottom padding-left}3 边框宽度{border-width:border-top-width border-right-width border-bottom-width border-left-width}宽度值:thin|medium|thick|数值4 边框颜色{border-color:数值数值数值数值}数值:分别代表top、right、bottom、left颜色值5 边框风格{border-style:none|hidden|inherit|dashed|solid|double|inset|outset|ridge|groove}6 边框{border:border-width border-style color}上边框{border-top:border-top-width border-style color}右边框{border-right:border-right-width border-style color}下边框{border-bottom:border-bottom-width border-style color}左边框{border-left:border-left-width border-style color}7 宽度{width:长度|百分比| auto}8 高度{height:数值|auto}9 漂浮{float:left|right|none}10 清除{clear:none|left|right|both}分类列表序号中文说明标记语法1 控制显示{display:none|block|inline|list-item}2 控制空白{white-space:normal|pre|nowarp}3 符号列表{list-style-type:disc|circle|square|decimal|lower-roman|upper-roman|lower-alpha|upper-alpha |none}4 图形列表{list-style-image:URL}5 位置列表{list-style-position:inside|outside}6 目录列表{list-style:目录样式类型|目录样式位置|url}7 鼠标形状{cursor:hand|crosshair|text|wait|move|help|e-resize|nw-resize|w-resize|s-resize|se-resize|sw-resize}字体属性:(font)大小{font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX、PD样式{font-style: oblique;}(偏斜体) italic;(斜体) normal;(正常)行高{line-height: normal;}(正常) 单位:PX、PD、EM粗细{font-weight: bold;}(粗体) lighter;(细体) normal;(正常)变体{font-variant: small-caps;}(小型大写字母) normal;(正常)大小写{text-transform: capitalize;}(首字母大写) uppercase;(大写) lowercase;(小写) none;(无) 修饰{text-decoration: underline;}(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁)常用字体:(font-family)"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana背景属性:(background)色彩{background-color: #FFFFFF;}图片{background-image: url();}重复{background-repeat: no-repeat;}滚动{background-attachment: fixed;}(固定) scroll;(滚动)位置{background-position: left;}(水平) top(垂直);简写方法{background:#000 url(..) repeat fixed left top;} /*简写·这个在阅读代码中经常出现,要认真的研究*/区块属性:(Block) /*这个属性第一次认识,要多多研究*/字间距{letter-spacing: normal;} 数值/*这个属性似乎有用,多实践下*/对齐{text-align: justify;}(两端对齐) left;(左对齐) right;(右对齐) center;(居中)缩进{text-indent: 数值px;}垂直对齐{vertical-align: baseline;}(基线) sub;(下标) super;(下标) top; text-top; middle; bottom; text-bottom;词间距word-spacing: normal; 数值空格white-space: pre;(保留) nowrap;(不换行)显示{display:block;}(块) inline;(内嵌) list-item;(列表项) run-in;(追加部分) compact;(紧凑) marker;(标记) table; inline-table; table-raw-group; table-header-group; table-footer-group; table-raw; table-column-group; table-column; table-cell; table-caption;(表格标题) /*display 属性的了解很模糊*/方框属性:(Box)width:; height:; float:; clear:both; margin:; padding:; 顺序:上右下左边框属性:(Border)border-style: dotted;(点线) dashed;(虚线) solid; double;(双线) groove;(槽线) ridge;(脊状) inset;(凹陷) outset;border-width:; 边框宽度border-color:#;简写方法border:width style color; /*简写*/列表属性:(List-style)类型list-style-type: disc;(圆点) circle;(圆圈) square;(方块) decimal;(数字) lower-roman;(小罗码数字) upper-roman; lower-alpha; upper-alpha;位置list-style-position: outside;(外) inside;图像list-style-image: url(..);定位属性:(Position)Position: absolute; relative; static;visibility: inherit; visible; hidden;overflow: visible; hidden; scroll; auto;clip: rect(12px,auto,12px,auto) (裁切)。
网页设计特效代码大全

style type="text/css">.star {position:absolute;layer-background-color:white;visibility:visible;top:-50px;width:50px;height:50px;font-size:1px;background-color:white;}</style><SCRIPT LANGUAGE="JavaScript"><!-- Beginvar starnum = 175; // Number of starsvar isNS = (yers);var _all = (isNS)? '' : 'all.';var _style = (isNS) ? '' : '.style';var xoffset, yoffset, w_x, w_y, tmpx, tmpy, scrlx, scrly; function getstartpos(obj) {obj.deltay = Math.floor(Math.random() * 12);obj.deltax = Math.floor(Math.random() * 12);obj.xdir = (Math.floor(Math.random() * 2) == 1) ? '+' : '-'; obj.ydir = (Math.floor(Math.random() * 2) == 1) ? '+' : '-'; obj.counter = 1;if (isNS) {obj.clip.width = 1;obj.clip.height = 1;obj.moveTo(xoffset+pageXOffset, yoffset+pageYOffset); } else {obj.width = 1;obj.height = 1;obj.pixelTop = yoffset+document.body.scrollTop;obj.pixelLeft = xoffset+document.body.scrollLeft;}}function movestar(starN) {tmpx = starN.deltax*starN.counter+starN.counter;tmpy = starN.deltay*starN.counter+starN.counter;if (isNS) {starN.clip.width = starN.counter / 3;starN.clip.height = starN.counter / 3;scrlx = pageXOffset;scrly = pageYOffset;if ((starN.left+tmpx >= w_x+scrlx) || (starN.top+tmpy >= w_y+scrly) || (starN.left-tmpx <= scrlx) || (starN.top-tmpy <= scrly)) {getstartpos(starN);} else {eval('starN.moveBy('+starN.xdir+tmpx+', '+starN.ydir+tmpy+')');}} else {starN.width = starN.counter/3;starN.height = starN.counter/3;scrlx = document.body.scrollLeft;scrly = document.body.scrollTop;if ((starN.pixelLeft+tmpx >= w_x+scrlx)||(starN.pixelTop+tmpy >= w_y+scrly) || (starN.pixelLeft-tmpx <= scrlx)||(starN.pixelTop-tmpy <= scrly)) {getstartpos(starN);} else {eval('starN.pixelTop'+starN.ydir+'=tmpy');eval('starN.pixelLeft'+starN.xdir+'=tmpx');}}starN.counter++;}function animate() {for(i=1; i <= starnum; i++) {movestar(eval('star'+i));}setTimeout('animate()', 100);}function findwindowparams() {w_x = (isNS) ? window.innerWidth : document.body.clientWidth;w_y = (isNS) ? window.innerHeight : document.body.clientHeight;xoffset = w_x / 2;yoffset = w_y / 2;for (i = 1; i <= starnum; i++) {getstartpos(eval('star'+i));}}function resizeNS() {setTimeout('document.location.reload()', 400);}(isNS) ? window.onresize = resizeNS : window.onresize = findwindowparams;window.onload = new Function("findwindowparams(); animate();");// End --></script>第二步:把<body>中加入如下代码:<SCRIPT LANGUAGE="JavaScript"><!-- Beginfor (i = 1; i <= starnum; i++) {document.writeln('<div id="star'+i+'" class="star"></div>'); eval('var star'+i+'=document.'+_all+'star'+i+_style);}// End --></script><html><head><title>滑动导航菜单</title></head><body><!--将以下代码加入HTML的<Body></Body>之间--><style><!--#ssm2 A {color:black;text-decoration:none;font-size:12;font-family:verdana;}#ssm2 A:hover {color:red;}--></style><script language="JavaScript1.2">function MM_displayStatusMsg(msgStr) {status=msgStr;document.MM_returnValue = true;function highlight(x){document.forms[x].elements[0].focus()document.forms[x].elements[0].select()}function MM_jumpMenu(targ,selObj,restore){eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); if (restore) selObj.selectedIndex=0;}var NSIE=document.all;NS=yers;hdrFontFamily="Verdana";hdrFontSize="2";hdrFontColor="white";hdrBGColor="#666666";linkFontFamily="Verdana";linkFontSize="2";linkBGColor="white";linkOverBGColor="#CCCCCC";linkTarget="_top";YOffset=60;staticYOffset=20;menuBGColor="black";menuIsStatic="no";menuHeader="欢迎光临"menuWidth=150; // Must be a multiple of 5!staticMode="advanced"barBGColor="#1298fd";barFontFamily="Verdana";barFontSize="2";barFontColor="white";barText="导航菜单"function moveOut() {if (window.cancel) {cancel="";}if (window.moving2) {clearTimeout(moving2);moving2="";}if ((IE && ssm2.style.pixelLeft<0)||(NS && document.ssm2.left<0)) {if (IE) {ssm2.style.pixelLeft += (5%menuWidth);}if (NS) {document.ssm2.left += (5%menuWidth);}moving1 = setTimeout('moveOut()', 5)}else {clearTimeout(moving1)}};function moveBack() {cancel = moveBack1()}function moveBack1() {if (window.moving1) {clearTimeout(moving1)}if ((IE && ssm2.style.pixelLeft>(-menuWidth))||(NS && document.ssm2.left>(-150))) { if (IE) {ssm2.style.pixelLeft -= (5%menuWidth);}if (NS) {document.ssm2.left -= (5%menuWidth);}moving2 = setTimeout('moveBack1()', 5)}else {clearTimeout(moving2)}};lastY = 0;function makeStatic(mode) {if (IE) {winY = document.body.scrollTop;var NM=ssm2.style}if (NS) {winY = window.pageYOffset;var NM=document.ssm2}if (mode=="smooth") {if ((IE||NS) && winY!=lastY) {smooth = .2 * (winY - lastY);if(smooth > 0) smooth = Math.ceil(smooth);else smooth = Math.floor(smooth);if (IE) NM.pixelTop+=smooth;if (NS) NM.top+=smooth;lastY = lastY+smooth;}setTimeout('makeStatic("smooth")', 1)}else if (mode=="advanced") {if ((IE||NS) && winY>YOffset-staticYOffset) {if (IE) {NM.pixelTop=winY+staticYOffset}if (NS) {NM.top=winY+staticYOffset}}else {if (IE) {NM.pixelTop=YOffset}if (NS) {NM.top=YOffset-7}}setTimeout('makeStatic("advanced")', 1)}}function init() {if (IE) {ssm2.style.pixelLeft = -menuWidth;ssm2.style.visibility = "visible"}else if (NS) {document.ssm2.left = -menuWidth;document.ssm2.visibility = "show"}else {alert('Choose either the "smooth" or "advanced" static modes!') }}function MM_displayStatusMsg(msgStr) {status=msgStr;document.MM_returnValue = true;}</script><script language="JavaScript1.2">if (IE) {document.write('<DIV ID="ssm2" style="visibility:hidden;Position : Absolute ;Left : 0px ;Top : '+YOffset+'px ;Z-Index : 20;width:1px" onmouseover="moveOut()" onmouseout="moveBack()">')}if (NS) {document.write('<LAYER visibility="hide" top="'+YOffset+'" name="ssm2" bgcolor="'+menuBGColor+'" left="0" onmouseover="moveOut()" onmouseout="moveBack()">')}tempBar=""for (i=0;i<barText.length;i++) {tempBar+=barText.substring(i, i+1)+"<BR>"}document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+16+2)+'" bgcolor="'+menuBGColor+'"><tr><td bgcolor="'+hdrBGColor+'" WIDTH="'+menuWidth+'"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+menuHeader+'</b></font></td><td align="center" rowspan="100" width="16" bgcolor="'+barBGColor+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD></tr>')function addItem(text, link, target) {if (!target) {target=linkTarget}document.write('<TR><TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'"onmouseout="bgColor=\''+linkBGColor+'\'"><ILAYER><LAYERonmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+link+'" target="'+target+'" CLASS="ssm2Items">'+text+'</A></FONT></LAYER></ILAYER></TD></TR>')}function addHdr(text) {document.write('<tr><td bgcolor="'+hdrBGColor+'" WIDTH="140"> <font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"><b>'+text+'</b></font></td></tr>')}addItem("广宇软件", "", "");addItem("天空下载", "", "");addHdr('友情连接');addItem("大富翁论坛", "", "");addItem("Codelphi", "", "");addItem("中国软件", "", "");document.write('<tr><td bgcolor="'+hdrBGColor+'"><font size="0" face="Arial"> </font></td></TR></table>')if (IE) {document.write('</DIV>')}if (NS) {document.write('</LAYER>')}if ((IE||NS) && (menuIsStatic=="yes"&&staticMode)) {makeStatic(staticMode);}</script><script> window.onload=init </script></body></html>动态文字中国素材网 2005-3-31 13:23:06 流量数:--------------------------------------------------------------------------------动态文字[查看演示] 源码如下----------------------------------------------------------------------------------------<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><meta name="GENERATOR" content="Microsoft FrontPage 4.0"><meta name="ProgId" content="FrontPage.Editor.Document"><title>New Page 1-</title><style><!--div { font-family: Tahoma }--></style></head><body onload="startmotor(0)"><script language="JavaScript1.2">/*Shock Wave Text script- By ejl@Submitted to and featured on Dynamic Drive ()For full source code, usage terms, and 100's more DHTML scripts, visit */var size = 25;var speed_between_messages=1500 //in milisecondsvar tekst = new Array(){tekst[0] = "Shock Wave text @ "; tekst[1] = "Here you can type anything you want"; tekst[2] = "You can change the size";tekst[3] = "And you can change the speed";}var klaar = 0;var s = 0;var veran =0;var tel = 0;function bereken(i,Lengte){return (size*Math.abs( Math.sin(i/(Lengte/3.14))) ); }function motor(p){var output = "";for(w = 0;w < tekst[s].length - klaar+1; w++){q = bereken(w/2 + p,16);if (q > size - 0.5){klaar++;}if (q < 5){tel++;if (tel > 1){tel = 0;if (veran == 1){veran = 0;s++;if ( s == tekst.length){s = 0;}p = 0;if (window.loop){clearInterval(loop)}loop = motor();}}}output += "<font style='font-size: "+ q +"pt'>" +tekst[s].substring(w,w+1)+ "</font>";}for(k=w;k<klaar+w;k++){output += "<font style='font-size: " + size + "pt'>" +tekst[s].substring(k,k+1)+ "</font>";}idee.innerHTML = output;}function startmotor(p){if (!document.all)returnvar loop = motor(p);if (window.time){clearInterval(time)}if (klaar == tekst[s].length){klaar = 0;veran = 1;tel = 0;var time = setTimeout("startmotor(" +(p+1) + ")", speed_between_messages);}else{var time =setTimeout("startmotor(" +(p+1) + ")", 50);}}</script><div ID="idee"></div></body></html><div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand"><input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div> ----------------------------------------------------------------------------------------。
网页特效代码

网页特效代码1.滚动字幕代码:<marquee style="width: 200px; height: 94px" onmouseover="function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { function onmouseover() { this.stop() } } } } } } } } } } } }" onmouseout="function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { function onmouseout() { this.start() } } } } } } } } } } } }" direction="up" height="94" width="200" scrollamount="1"><p align="center"><font color="#ff0000" size="4"><strong>祝大家端午节快乐</strong></font><br /><font color="#ae1515">1、公告区内有成绩下载链接,请下载后查看是否有遗漏作业;<br />2、模块三活动1中非案例领取人需提前一天完成该项作业,最后一天为案例领取人总结时间。
网页特效代码

典型特效加入收藏夹设为首页去掉超链接的下划线自动刷新网页刷新本页返回到上一页跳出小窗口自动关闭窗口给页面加保护固定字号大小状态栏例的动态欢迎语保护自己的页面不被别人放在框架中说明点击即可把你的网站添加到浏览器的收藏菜单下效果收藏本站代码<span style="CURSOR: hand" onClick="window.external.addFavorite('','网页特效集锦')" title="网页特效集锦">收藏本站</span>说明点击即可把你的网站设置为浏览器的起始页效果设为首页代码<span onclick="var strHref=window.location.href;this.style.behavior='url(#default#homepage)';this.s etHomePage('');" style="CURSOR: hand">设为首页</span>说明有时候看着那超链接的下划线挺讨厌的,把下面这段代码放到网页源代码<head>与</head>之间,下划线就无影无踪啦!注意,网页的<body>标签里不能再有link之类的属性,否则本效果会失效!效果试试就知道啦!代码 <style TYPE="text/css"><!--A:link{text-decoration:none}A:visited{text-decoration:none}A:hover {color: #ff00ff;text-decoration:underline}--></style>说明自动刷新网页在HTML的与之间加入下面这段代码,则在5分钟之后正在浏览的页面将会自动变为target.html这一页。
网页设计特效代码

塔里木大学信息工程学院计算机12-3陈浩整理目录1.让文字不停地滚动 (4)2.不同时间段显示不同问候语 (4)3.让网页随意后退(这是写在BODY里的源码) (4)4.随机变换背景图象(一个可以刷新心情的特效) (5)5.文字效果向上的效果 (5)6.鼠标放到链接上就会出现一个说明框,里面有滚动的文字说明 (6)7.时钟 (7)8.状态栏的打字效果 (8)9.统计访问次数 (9)10.页面中登陆FTP (10)11.图片渐渐显示 (12)12.图片大小随鼠标触碰而变化 (12)13.页面自动滚屏效果 (12)14.文字从天而降 (13)15.百页窗效果 (19)16.舞台光柱照射效果 (21)17.各种用途的按钮大集合 (21)18.自动刷新网页 (23)19.保护自己的页面不被别人放在框架中 (23)20.打字机打彩色文字 (23)21.鼠标激活警告框 (25)23.彩色滚动条 (27)24.跳出小窗口 (27)25.很酷的类似鼠标跟随的遮照效果 (27)26.在一个Textarea框中,文字逐个输出,而且自动换行和刷屏 (28)27.鼠标键值表 (30)28.非常实用的随机产生用户密码脚本 (30)29.鼠标带图像效果 (33)30.一个很好的文字效果 (62)31.打把游戏 (65)32.超酷文字下落效果 (72)33.多格式下拉菜单 (77)34.文字的变换导航 (79)35.随机文字显示 (85)36.链接使图片变换 (85)37.banner变换导航 (87)39.不间断滚动的处理 (93)40.相同地方滚动新闻 (95)41.图片的任意方向移动(窗帘效果) (97)42.很酷的图片集旋转显示 (99)43.小巧实用的鼠标时钟 (102)44.上下滚动的文字 (109)45.怎样去掉图片链接点击后,图片周围的虚线? (110)46.怎样让表单没有凹凸感? (113)47.<div><span>&<layer>的区别? (113)48.让弹出窗口总是在最上面 (113)49.不要滚动条? (114)50.怎样去掉图片链接点击后,图片周围的虚线? (114)51.电子邮件处理提交表单 (114)52.在打开的子窗口刷新父窗口的代码里如何写? (114)53.如何设定打开页面的大小 (115)54.在页面中如何加入不是满铺的背景图片,拉动页面时背景图不动 (115)55.检查一段字符串是否全由数字组成 (115)56. 获得一个窗口的大小 (115)57.怎么判断是否是字符 (115)58.TEXTAREA自适应文字行数的多少 (116)59. 日期减去天数等于第二个日期 (116)60. 选择了哪一个Radio (116)61.脚本永不出错 (117)62.ENTER键可以让光标移到下一个输入框 (117)63. 检测某个网站的链接速度: (117)64. 各种样式的光标 (118)65.页面进入和退出的特效 (119)66.在规定时间内跳转 (120)67.网页是否被检索 (120)68.可移动的页面窗口 (120)69.隐藏层的打开关闭 (121)70.用鼠标弹出隐藏层 (123)71.文字整屏下坠 (127)72.可显示隐藏的层 (129)73.花絮向右飞舞(有下雪的感觉) (132)74.有点象游戏中的聊天窗口 (134)75.模拟下雪景象 (138)76.极具创意的小球 (139)77.页面闪电效果 (146)78.巨酷的东西! (152)79.会自动消失的层 (159)80.页面上出现随意舞动的星 (161)81.招牌文字特效 (164)83.打开页面特效(缩小方块) (173)84.打开页面特效(一)(上下分开) (174)85.打开页面特效(二)(开门特效) (176)86.页面左右象百页窗一样地打开,也非常好看,赶快用吧 (178)87.页面象马赛克一样一块一块地慢慢打开,效果非常棒的 (180)88.可以用来做首页的诸多特效 (184)89.向右移屏 (194)90.缩进式的导航条 (195)91.获得系统时间 (200)92.取得来访用的IP (200)93.获得系统,浏览器版本 (201)94.去除IE混动条 (201)95.进入网站,跳出广告 (201)96.随机数 (201)97.向上混动代码 (201)98.自动关闭网页 (202)99.随机背景音乐 (202)100.自动刷新本页面 (202)101.ACCESS数据库连接 (203)102.SQL数据库连接 (203)103.用键盘打开网页代码 (204)104.让层不被控件复盖代码 (204)105.动网FLASH广告代码 (204)106.VBS弹出窗口小代码 (205)107.使用FSO修改文件特定内容的函数 (205)108.使用FSO读取文件内容的函数 (205)109.使用FSO读取文件某一行的函数 (206)120.使用FSO写文件某一行的函数 (206)121.使用FSO添加文件新行的函数 (207)122.读文件最后一行的函数 (207)124.点击返回上页代码 (212)125.点击刷新代码 (212)126.点击刷新代码 (212)127.弹出警告框代码 (213)128.状态栏信息 (213)129.背景色变换 (213)130.点击打开新窗口 (214)131.分页代码 (214)132.name 属性 (217)133.http-equiv属性 (218)1.让文字不停地滚动<MARQUEE>滚动文字</MARQUEE>2.不同时间段显示不同问候语(放在SCRIPT中,然后将多余的SCRIPT情节去除)<Script Language="JavaScript"><!--var text=""; day = new Date( ); time = day.getHours( );if (( time>=0) && (time < 7 ))text="夜猫子,要注意身体哦! "if (( time >= 7 ) && (time < 12))text="今天的阳光真灿烂啊,你那个朋友呢?"if (( time >= 12) && (time < 14))text="午休时间。
HTML特效代码大全完整全收录

HTML特效代码大全(完整全收录)1) 贴图:<img src="图片地址">2)加入连接:<a href="所要连接的相关地址">写上你想写的字</a>3)在新窗口打开连接:<a href="相关地址" target="_blank">写上要写的字</a>消除连接的下划线在新窗口打开连接:<a href="相关地址" style="text-decoration:none"target="_blank">写上你想写的字</a>4)移动字体(走马灯):<marquee>写上你想写的字</marquee>5)字体加粗:<b>写上你想写的字</b>6)字体斜体:<i>写上你想写的字</i>7)字体下划线: <u>写上你想写的字</u>8)字体删除线: <s>写上你想写的字</s>9)字体加大: <big>写上你想写的字</big>10)字体控制大小:<h1>写上你想写的字</h1> (其中字体大小可从h1-h5,h1最大,h5最小)11)更改字体颜色:<font color="#value">写上你想写的字</font>(其中value值在000000与ffffff(16位进制)之间12)消除连接的下划线:<a href="相关地址" style="text-decoration:none">写上你想写的字</a>13)贴音乐:<embed src=音乐地址width=300 height=45 type=audio/mpeg autostart="false">14)贴flash: <embed src="flash地址" width="宽度" height="高度">15)贴影视文件:<img dynsrc="文件地址" width="宽度" height="高度" start=mouseover>16)换行:<br>17)段落:<p>段落</p>18)原始文字样式:<pre>正文</pre>19)换帖子背景:<body background="背景图片地址">20)固定帖子背景不随滚动条滚动:<body background="背景图片地址" bodybgproperties=fixed>21)定制帖子背景颜色:<body bgcolor="#value">(value值见10)22)帖子背景音乐:<bgsound="背景音乐地址" loop=infinite>23)贴网页:<iframe src="相关地址" width="宽度" height="高度"></iframe>HTML特效代码1。
常用的网页特效代码

常用的网页特效代码1.文本向上循环滚动说明:文本自动向上循环滚动,鼠标放到上面还会暂时停下来。
果:代码:2.页面自动滚屏效果<body onLoad="scrollit()"><SCRIPT language="JavaScript"><!--function scrollit(){for (I=1; I<=500; I++){self.scroll(1,I)}}//--></SCRIPT>3.滚动的文字说明说明鼠标放到链接上就会出现一个说明框,里面有滚动的文字说明效果把鼠标放上来试试代码4.飘动的字符跟随鼠标说明在鼠标后面跟着一串飘动的字符效果看看就知道啦!Array代码5.一群小点跟随鼠标说明跟随鼠标的一群小点,就象星星一样效果看看就知道啦!代码6.接触链接自动打开窗口说明鼠标放到链接上,就立刻弹出警告框效果试试Array代码7.数字时钟说明数字化的时钟效果 现在时刻:12:07:54代码8.显示停留的时间说明 显示他人在页面停留的时间,而且可以作出提醒效果代码 9.有影子的数字时钟说明 这个时钟是有影子的,而且还在不停地走着呢效果12:09:3612:09:36代码10.打字效果说明:文字在状态栏上从左往右一个一个地显示,就象你打出的字一样效果:看看状态栏!Array代码:11.文字不停闪烁说明:一段文字在状态栏上不停跳动显示,可以作为提示信息效果:看看状态栏!代码:12.图象大小自动变化说明:把一张图片变形扭曲成各种不同的长宽,非常好玩效果:代码:13.漫天飞雪说明:漫天飞雪效果:看到了吗?代码:14.自由移动的图片(一)说明:自由移动的图片效果:看到了吗?Array代码:再把<body>改为:说明:图片在页面内随意飘动,遇到边界还会反弹。
效果: 看到了吗?代码:16.状态栏里的动态欢迎语说明 浏览器的状态栏里出现一个字接一个字往左跑的欢迎语!效果 看看状态栏:)代码17.背景色变换按钮:18.去掉超链接的下划线说明有时候看着那超链接的下划线挺讨厌的,把下面这段代码放到网页源代码<head>与</head>之间,下划线就无影无踪啦!注意,网页的<body>标签里不能再有link之类的属性,否则本效果会失效!效果试试就知道啦!代码19.给页面加保护说明如果你不想让辛辛苦苦做出来的东西被人轻易地Copy&Paste走的话,不妨在HTML里加入下面这段代码。
常用网站特效代码

我们要先做一个16*16的icon(图标文件),保存为index.ico。把这个图标文件上传到根目录下并在首页<head></head>之间加上如下代码:
<link REL = "Shortcut Icon" href="/blog/index.ico">
5.让网页随意后退
11.表格的半透明显示效果
在<head></head>之间加上如下代码:
<style>
.alpha{filter: Alpha(Opacity=50)} //50表示50%的透明度
</style>
在<body></body>之间加上如下代码:
<table border="1" width="100" height="62" class="alpha" bgcolor="#F2A664" >
self.moveBy (0,-800);
for(i = x; i > 0; i--)
{
self.moveBy(0,3);
}
for(j = 200; j > 0; j--){ //如果你认为窗口抖动厉害,就200换成个位数
self.moveBy(0,j);
<a href="java:history.go(-X)">X</a> //把X换成你想要后退在页数
//把“-”变成“+”就为前进
6.鼠标指向时弹出信息框
在<body></body>之间加上如下代码:
<a href over="alert('弹出信息!')">显示的链接文字</a>
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
网页特效代码大全(一)
2008-06-28 21:42
特别推荐
带注释的表格菜单
右键单击的菜单2
可拖动的菜单1
文件夹式的菜单
很酷的导航菜单
定制窗口全攻略
多变的图像导航
图片滚动公告栏
自由移动和切换的图片鼠标控制的移动图像下雨了
非常漂亮的图像效果跑马灯文字1 跟随鼠标滚动文字
鼠标控制窗口滚动
精制的鼠标时钟
非常棒的打开小窗口特
效
非常棒的无边窗口特效
状态栏的完整时间
用状态栏记录用户信息
状态栏的停留时间信息
标题栏的时间显示
显示中文日期与时间
挂历的时间显示
实时走动的时钟
禁止用“另存为”保存
页面
随鼠标变色的文字
简单的文字加密
最简单的链接说明代码
图片集旋转显示?
图片向上翻滚?
图片渐变效果?
图片模糊变化?
无用的右键单击
跟随鼠标的文字
加入收藏
设为首页
有立体感的文字
三种
加密
右键
放大
动感
另类
自动
滚动
很酷
鼠标
文本
前进
颜色
图片特效
晃动的图形
动感的图片
点击消失的图片
另类的图像导航
旋转的图片
会弹跳的球
可以拖动的图片
可以拖动的多张图片礼花背景
满天漂落的星
随机变换的图像
图形淡出淡隐
围绕鼠标旋转的图片自动变换的图像及链接图片渐渐出现脚本
自由移动和切换的图片点击放大图片
多变的图像导航
总在指定位置的图片
可点击放大缩小的图片
可以无限放大的图像
非常漂亮的图像效果
鼠标控制的移动图像
下雪了
下雨了
鼠标点亮图片
水韵效果
不停闪烁的图片
下拉框选择显示图片
新窗口的下拉框选择器
展开隐藏图片
广告图片轮换
抖动的图片
水中倒影
图片全景旋转的技巧
图片自动切换
放大镜
定时闪烁的图片
鼠标感应放大
背景色选择器
流动背景
渐隐渐现的半透明图像
半透明图片的显示
鼠标移动图像<new>
图片集旋转显示<new>
图片边框的变幻<new>
禁止图片下载的脚本
图片滚动公告栏
图片
图形
图片
图片
图片
图片
图片
带彩
页面
图片
图像
简单
特殊
图片
自由
图像。